@charset "UTF-8";

/*===== STYLE LIST ==========================================================
1: Custom Setting
2: Framework
3: Header
4: Top Module
5: Aside
6: Footer
7: Module
============================================================================= */

/*  1: Custom Setting
=========================================================================== */

/* Base */
html {
	font-size: 62.5%;
	letter-spacing: .02rem;
	line-height: 1.5;
	overflow-y: scroll;
}
body {
	min-width: 980px;
	margin: 0;
	padding: 0;
	background: #F0F0DD url("/common/images/body-bg.gif") repeat-x left top;
	color: #222222;
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Meiryo, メイリオ, "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "Hiragino Kaku Gothic ProN", sans-serif;
	font-size: 1.4rem;
}
*, *::before, *::after {
  box-sizing: border-box;
}

/* Link
--------------------------------------------------------------------------- */
a {
	text-decoration: none;
}
a:link {
	color: #0000ff;
}
a:visited {
	color: #003399;
}
a:hover {
	color: #0000ff;
	text-decoration: underline;
}
a:active {
	color: #0000ff;
	text-decoration: underline;
}
a:focus {
	color: #0000ff;
	text-decoration: underline;
}

/* Image
--------------------------------------------------------------------------- */
figure {
	display: block;
	margin: 0;
}
figure figcaption {
	display: block;
	margin-top: .5rem;
	text-align: center;
	font-size: 1.4rem;
}
figure.line {
	border: .5rem solid #A4C1CC;
}
figure.row {
	display: flex;
	justify-content: space-around;
}
img {
	max-width: 100%;
	width: auto;
	height: auto;
	vertical-align: bottom;
}
a img {
	border: none;
}

/* Text
--------------------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
	margin-top: 0;
}
h1 {
	font-size: 2rem;
}
main h1.line {
	position: relative;
    margin-bottom: 3rem;
	padding: .6rem;
	border-bottom: 4px solid #c2b372;
}
main h1.line::before {
	content: '';
	position: absolute;
	bottom: -4px;
	left: 0;
	width: 4em;
	height: 4px;
	background-color: #2d4d90;
}
h2 {
	margin-bottom: 1.5rem;
	font-size: 1.8rem;
}
main h2.title {
    margin-bottom: 3rem;
	padding: .4rem .4rem .8rem .8rem;
	border-left: 8px solid #2F4F8E;
	border-bottom: 1px solid #2F4F8E;
}
h3 {
	margin-bottom: 2rem;
	font-size: 1.6rem;
}
h4, h5, h6 {
	font-size: 1.4rem;
	margin-bottom: 1.5rem;
}
p {
	margin-top: 0;
}

/* List
--------------------------------------------------------------------------- */
ol,
ul {
	margin: 0 0 1rem 0;
	padding-left: 2rem;
}
ol li,
ul li {
	margin-bottom: .5rem;
}
dl {
	margin: 0 0 1rem 0;
}
dl dt {
	margin-bottom: .5rem;
}
dl dd {
	margin-left: 0;
}

/* Table
--------------------------------------------------------------------------- */
table {
	border-collapse: collapse;
	border-spacing: 0;
	empty-cells: show;
}
caption,
th,
td {
	text-align: left;
}

/* Form
--------------------------------------------------------------------------- */
form {
	display: block;
	margin-bottom: 0;
}
fieldset {
	margin: 0;
	padding: 0;
	border: none;
}
input[type='password'],
input[type='tel'],
input[type='text'],
input[type='email'],
input[type='search'] {
  -webkit-appearance: none;
	appearance: none;
	width: 100%;
	padding: .8rem 1rem;
	background-color: #FFFFFF;
	border: .1rem solid #CCCCCC;
	border-radius: .4rem;
	overflow: hidden;
}
textarea,
select {
	padding: 0 1rem;
	background-color: #FFFFFF;
	border: .1rem solid #CCCCCC;
	border-radius: .4rem;
	overflow: hidden;
}
button,
input[type='button'],
input[type='reset'],
input[type='submit'] {
	display: inline-block;
	padding: 0;
	border: none;
	cursor: pointer;
	font-size: 1.6rem;
	font-weight: normal;
}
button[type='reset'],
input[type='button'].cancel {
	border-color: #CDCDCD!important;
	color: #777777;
}
button[disabled],
input[type='button'][disabled],
input[type='reset'][disabled],
input[type='submit'][disabled] {
	background-color: #E7E7E7;
	border-color: #E7E7E7;
	opacity: 1;
}
label,
legend {
	display: inline-block;
	font-weight: normal;
}
::-webkit-input-placeholder {
	color: #999999;
	opacity: 1;
}
::-moz-placeholder {
	color: #999999;
	opacity: 1;
}
:-ms-input-placeholder {
	color: #999999;
	line-height: 2.8rem;
}
::-ms-input-placeholder {
	position: relative;
	color: #999999;
}
:placeholder-shown {
	color: #999999;
}
:focus:placeholder-shown {
	color: #999999;
}
:placeholder {
	color: #999999;
}


/* 2: Framework
=========================================================================== */
#container {
	position: relative;
	width: 980px;
	margin: 0 auto;
	padding: 0 10px;
	background-color: #FFFFFF;
}

#contents::after {
  content: '';
  display: block;
  clear: both;
}

/* Section Layout
--------------------------------------------------------------------------- */
section {
    margin: 60px 0;
}

section :last-child {
	margin-bottom: 0!important;
}

.rowBlock {
    display: flex;
    justify-content: space-between;
}

.rowBlock + .rowBlock {
    margin-top: 40px;
}

.rowBlock.layout01 > div:first-child {
    flex-basis: 500px;
}

.rowBlock.layout01 > div:last-child {
    flex-basis: 250px;
    margin-left: 20px;
}

.rowBlock.layout02 > div {
    flex-basis: 365px;
}

.rowBlock.layout02 > div + div {
    margin-left: 20px;
}

/* 3: Header
=========================================================================== */
header {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 2rem 0 1rem 0;;
	background-color: #FFFFFF;
}
header a {
	color: #222222;
}
header h1,
header .logo {
	display: flex;
	align-items: center;
	margin: 0 auto 0 0;
	line-height: 1;
}
header h1 a,
header .logo a {
	flex: 0 1 auto;
	display: inline-block;
}
header h1 img,
header .logo img {
	display: inline-block;
	width: 112px;
	vertical-align: middle;
}
header h1 span,
header .logo span {
	display: inline-block;
	margin-left: 1rem;
	color: #666666;
	font-size: 1.4rem;
	font-weight: normal;
	white-space: nowrap;
}
header p {
	margin-bottom: 0;
}
header .query a {
	display: block;
	padding: .5rem 3rem;
	border: 1px solid #DDDDDD;
	border-radius: 2px 2px;
	color: #222222;
	line-height: 1;
	transition: .3s ease-in-out;
}
header .query a:hover {
	background-color: #F4F4F4;
	text-decoration: none;
}

/* Global navigation */
.globalNav {
	background-color: #000000;
}
.globalNav ul {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	width: 960px;
	margin: 0;
	padding: 0;
	border-bottom: 2px solid #FFCE00;
	list-style: none;
}
.globalNav + .contents {
    margin-top: 2.5rem;
}
.globalNav ul li {
	margin-bottom: 0;
	text-align: center;
}
.globalNav ul li:not(:last-child) {
	min-width: 15rem;
	border-right: 1px solid #494949;
}
.globalNav ul li:last-child {
	min-width: auto;
	margin: 0 10px 0 auto;
	font-size: 1.2rem;
}
.globalNav ul li a {
	position: relative;
	display: block;
	height: 100%;
	padding: .7rem 1rem .7rem .5rem;
	color: #FFFFFF;
	text-decoration: none;
}
.globalNav ul li a span {
	display: inline-block;
	height: 100%;
	padding-left: 2.4rem;
	background-position: left center;
	background-repeat: no-repeat;
}
.globalNav ul li.top a span {
	background-image: url("/common/images/gnavi-icon-top.png");
}
.globalNav ul li.service a span {
	background-image: url("/common/images/gnavi-icon-service.png");
}
.globalNav ul li.news a span {
	background-image: url("/common/images/gnavi-icon-news.png");
}
.globalNav ul li.procedure a span {
	background-image: url("/common/images/gnavi-icon-procedure.png");
}
.globalNav ul li.faq a span {
	background-image: url("/common/images/gnavi-icon-faq.png");
}
.globalNav ul li.about a span {
	background-image: url("/common/images/gnavi-icon-about.png");
}
.globalNav ul li:not(:last-child) a:hover::after,
.globalNav ul li:not(:last-child) a:active::after,
.globalNav ul li:not(:last-child) a:focus::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: -2px;
	width: 100%;
	height: 2px;
	background-color: #FF3300;
}
.globalNav ul li:last-child a {
	display: inline;
	padding: 0;
}
.globalNav ul li:last-child a span {
	display: inline;
	padding-left: 1.8rem;
}
.globalNav ul li:last-child a:hover,
.globalNav ul li:last-child a:active,
.globalNav ul li:last-child a:focus {
	text-decoration: underline!important;
}

/* 4: Top Module
=========================================================================== */

/* Main
--------------------------------------------------------------------------- */
main {
    display: block;
    padding-bottom: 1px;
}
main:not([class]) {
	float: left;
	width: 680px;
}
main.single {
    width: 75rem;
    margin: 0 auto;
    padding-bottom: 6rem;
}

main.single > :last-child {
    margin-bottom: 0;
}

/* No script
--------------------------------------------------------------------------- */
.noScript p {
	display: block;
	margin: 1rem 0;
	background-color: #FFFFFF;
	border-radius: 4px;
	text-align: center;
}

/* Important Block
--------------------------------------------------------------------------- */
.importantBlock {
	position: relative;
	margin-bottom: 3rem;
	padding: 10px 15px 10px 30px;
	background-color: #FFEBEB;
}
.importantBlock::after {
	content: "◆";
	position: absolute;
	top: 10px;
	left: 10px;
	color: #FF8585;
}
.importantBlock :last-child {
	margin-bottom: 0;
}
.importantBlock p {
	margin-bottom: .25em;
}

/* Service Block
--------------------------------------------------------------------------- */
.serviceBlock {
	margin: 0 0 5rem 0;
}
.serviceBlock h2 {
	margin-bottom: 1.5rem;
	padding: .3rem 0 .6rem 4rem;
	background: url("/common/images/header-icon-service.png") no-repeat left top;
	border-bottom: 2px solid #1C5572;
	font-size: 1.6rem;
}
.serviceList {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	margin: 0;
	padding-left: 0;
	list-style: none;
}
.serviceList > li {
	max-width: 680px;
	width: calc((680px - 20px) / 3);
	margin-bottom: 10px!important;
	border: 1px solid #CDCDCD;
	border-radius: 2px 2px;
}
.serviceList > li:not(:nth-child(3n+3)) + li {
	margin-left: 10px;
}
.serviceList.pickup > li {
	width: calc((680px - 10px) / 2);
	border: 3px solid #E8E0BA;
}
.serviceList.pickup > li:not(:nth-child(even)) + li {
	margin-left: 10px;
}
.serviceList.single {
    flex-wrap: nowrap;
}
.serviceList.single > li {
    width: 680px;
}
.serviceList > li h3 {
	margin-bottom: 0;
	font-size: 1.4rem;
}
.serviceList > li h3 a {
	display: block;
	padding: .8rem 1.6rem .8rem 1rem;
	background: #F4F4F4 url("/common/images/icon-arrow-detail.png") no-repeat 97% center;
	color: #222222;
}
.serviceList.single > li h3 a {
    background-position: 99% center;
}
.serviceList.pickup > li h3 a {
	padding: 1rem 2rem 1rem 1rem;
	background: #F8F6E9 url("/common/images/icon-arrow-detail.png") no-repeat 98% center;
}
.serviceList > li h3 span {
	font-size: 1.2rem;
}
.serviceList > li .inner {
	padding: 9rem 1rem 1.4rem 1rem;
	background-position: center 20px;
	background-repeat: no-repeat;
}
.serviceList > li .inner h4 {
    margin-bottom: .75rem;
}
.serviceList > li.overseas .inner {
	background-image: url("/common/images/service-icon-overseas.png");
}
.serviceList > li.person .inner {
	background-image: url("/common/images/service-icon-person.png");
}
.serviceList > li.telecom .inner {
	background-image: url("/common/images/service-icon-telecom.png");
}
.serviceList > li.magazine .inner {
	background-image: url("/common/images/service-icon-magazine.png");
}
.serviceList > li.law .inner {
	background-image: url("/common/images/service-icon-law.png");
}
.serviceList > li.copy .inner {
	background-image: url("/common/images/service-icon-copy.png");
}
.serviceList > li.map .inner {
	background-image: url("/common/images/service-icon-map.png");
}
.serviceList > li.marketing .inner {
	background-image: url("/common/images/service-icon-marketing.png");
}
.serviceList > li.bid .inner {
	background-image: url("/common/images/service-icon-bid.png");
}
.serviceList.pickup > li.company .inner {
	padding: 1rem 1rem 1rem 11rem;
	background: url("/common/images/service-icon-company.png") no-repeat 10px 20px;
}
.serviceList.pickup > li.news .inner {
	padding: 1rem 1rem 1rem 11rem;
	background: url("/common/images/service-icon-news.png") no-repeat 10px 20px;
}
.serviceList.single > li.compliance .inner {
    display: flex;
    justify-content: space-between;
	padding: 1rem;
}
.serviceList.single > li.compliance .inner .gchecker {
	width: calc(100% - 214px - 230px - 22px);
}
.serviceList.single > li.compliance .inner .overseas {
	width: 214px;
}
.serviceList.single > li.compliance .inner .screening {
	width: 230px;
}
.serviceList.single > li.compliance .inner > div + div {
	margin-left: 10px;
	padding-left: 10px;
	border-left: 1px solid #CDCDCD;
}
.serviceList.single > li.compliance .inner h4 {
	display: flex;
	align-items: center;
	min-height: 36px;
	width: 100%;
	padding-left: 32px;
	background-position: left center;
	background-repeat: no-repeat;
	background-size: 24px auto;
	line-height: 1.25;
}
.serviceList.single > li.compliance .inner .gchecker h4 {
	background-image: url("/common/images/service-icon-gchecker.png");
}
.serviceList.single > li.compliance .inner .overseas h4 {
	background-image: url("/common/images/service-icon-overseascheck.png");
}
.serviceList.single > li.compliance .inner .screening h4 {
	background-image: url("/common/images/service-icon-screening.png");
}
.serviceList > li .read {
	color: #666666;
	font-size: 1.3rem;
}
.serviceList.pickup > li .read {
	padding-bottom: 0;
}
.serviceList .naviList {
	margin-bottom: 0;
	padding-left: 0;
	list-style: none;
}
.serviceList .naviList li {
	padding-left: 1.8rem;
	background: url("/common/images/icon-arrow-link.png") no-repeat left .125em;
}
.serviceList .naviList li:last-child {
	margin-bottom: 0;
}
.serviceList .naviList li.login {
	background-image: url("/common/images/icon-login-link.png");
	background-position: left .125em;
}
.serviceList > li.more {
	display: flex;
	justify-content: center;
	align-items: center;
}
.serviceList > li.more a {
	display: inline-block;
	align-content: center;
	position: relative;
	padding-top: 50px;
}
.serviceList > li.more a::after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 50%;
	width: 0;
	height: 0;
	margin-left: -12px;
	border-style: solid;
	border-width: 16px 0 16px 24px;
	border-color: transparent transparent transparent #D2EFF5;
}

/* News Block
--------------------------------------------------------------------------- */
.newsBlock {
	margin: 5rem 0;
}
.newsBlock h2 {
	display: flex;
	justify-content: space-between;
	margin-bottom: 1.5rem;
	padding: .3rem 0 .6rem 4rem;
	background: url("/common/images/header-icon-news.png") no-repeat left top;
	border-bottom: 2px solid #1C5572;
	font-size: 1.6rem;
}
.newsBlock h2 a {
	margin-left: auto;
	padding-left: 2rem;
    background: url("/common/images/icon-arrow-link.png") no-repeat left .4rem;
	color: #222222;
	font-size: 1.4rem;
	font-weight: normal;
}
.newsBlock .newsList {
	padding: 0 10px;
}
.newsBlock .newsList dl {
	display: flex;
	width: 100%;
}
.newsBlock .newsList dl dt {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	min-width: 140px;
	margin-bottom: 0;
}
.newsBlock .newsList dl dt span {
	display: inline-block;
	margin: .2rem 0 0 1rem;
	padding: .2rem 1rem;
	color: #FFFFFF;
	font-size: 1.2rem;
	line-height: 1.3;
	white-space: nowrap;
}
.newsBlock .newsList dl dt span.notice {
	background-color: #C43F3D;
}
.newsBlock .newsList dl dt span.close {
	background-color: #727272;
}
.newsBlock .newsList dl dt span.new  {
	background-color: #416bA3;
}
.newsBlock .newsList dl dt span.change {
	background-color: #644199;
}
.newsBlock .newsList dl dt span.info {
	background-color: #3B87A8;
}
.newsBlock .newsList dl dd {
	flex: 1 1 auto;
	margin-left: 1em;
	padding-left: 1em;
	background: url("/common/images/icon-arrow-news.png") no-repeat left .5rem;
}

/*  Other Block
--------------------------------------------------------------------------- */
.otherBlock {
	margin-bottom: 4rem;
}
.otherBlock h2 {
	margin-bottom: 1.5rem;
	padding: .2rem 0 .8rem .2rem;
	border-bottom: 2px solid #999999;
	font-size: 1.6rem;
}
.otherBlock .bnrList {
	display: flex;
	flex-wrap: wrap;
	padding: 0 10px;
	list-style: none;
}
.otherBlock .bnrList li {
	margin-bottom: 10px;
}
.otherBlock .bnrList li:not(:nth-child(3n+3)) + li {
	margin-left: 15px;
}

/*  SAGAS Block
--------------------------------------------------------------------------- */
.sagasBlock {
	margin-bottom: 5rem;
}
.sagasBlock h2 {
	display: table;
	margin-bottom: 0;
}
.sagasBlock h2 span {
	display: table-cell;
}
.sagasBlock iflame {
	max-width: 680px;
}
.fw-feed-item {
	padding: 1rem 0!important;
}

/* 5: Aside
=========================================================================== */
aside {
	float: right;
	display: block;
	width: 260px;
}
aside > :last-child {
	margin-bottom: 0;
}

/* Member Block */
aside .memberBlock {
	margin-bottom: 2rem;
	border: 5px solid #C9E4EA;
}
aside .memberBlock h2 {
	margin-bottom: 0;
	padding: 1.5rem 1rem;
	background-color: #D2EFF5;
	font-size: 1.4rem;
	text-align: center;
}
aside .memberBlock .inner {
	padding: 20px 10px;
}
aside .memberBlock .inner .loginBtn {
	margin-bottom: 10px;
}
aside .memberBlock .inner .loginBtn a {
	display: block;
	padding: 1.5rem 1rem;
	border-radius: 6px 6px;
	background: linear-gradient(#00A3E5, #0087BD);
	color: #FFFFFF;
	font-size: 1.8rem;
	text-align: center;
	transition: .3s ease-in-out;
}
aside .memberBlock .inner .loginBtn a:hover {
	background: linear-gradient(#00AFE9, #00A2D7);
	text-decoration: none;
}
aside .memberBlock .inner .loginBtn a span {
	display: inline-block;
	padding-left: 2.4rem;
	background: url("/common/images/icon-btn-login.png") no-repeat left center;
}
aside .memberBlock .inner .loginHelp {
	margin-bottom: 2em;
}
aside .memberBlock .inner .loginHelp::after {
	content: '';
	display: block;
	clear: both;
}
aside .memberBlock .inner .loginHelp p {
	float: right;
	display: inline-block;
	margin-bottom: 0;
	padding-left: 1.8rem;
    background: url("/common/images/icon-arrow-link.png") no-repeat left .2rem;
	font-size: 1.2rem;
}
aside .memberBlock .inner .loginHelp p a {
	color: #222222;
}
aside .memberBlock .inner .loginList {
	margin-bottom: 0;
	padding-left: 0;
	list-style: none;
}
aside .memberBlock .inner .loginList li {
	padding-left: 2.2rem;
	background: url("/common/images/icon-login-link.png") no-repeat left .3rem;
}
aside .memberBlock .inner .loginList li:last-child {
	margin-bottom: 0;
}
aside .memberBlock .inner .loginList li a {
	color: #008DC9;
}
aside .memberBlock .inner .loginList li.previous {
	margin: 2rem 0 0 0;
	background: url("/common/images/icon-login-previous.png") no-repeat left top;
	font-size: 1.2rem;
}
aside .memberBlock .inner .loginList li.previous a {
	color: #333333;
}

/* Usage Block */
aside .usageBlock {
	margin-bottom: 2rem;
	padding: 15px 10px 20px 10px;
	background: url("/common/images/side-user-bg.png") repeat left top;
}
aside .usageBlock h2 {
	margin-bottom: 2rem;
	padding: 0 1rem;
	font-size: 1.4rem;
	text-align: center;
}
aside .usageBlock h3 {
	margin-bottom: 0.75rem;
	padding-left: 2.6rem;
	background-position: left center;
	background-repeat: no-repeat;
	font-size: 1.4rem;
}
aside .usageBlock .report,
aside .usageBlock .blog {
	margin-bottom: 2rem;
}
aside .usageBlock .report h3{
	background-image: url("/common/images/side-usage-report.png");
}
aside .usageBlock .blog h3 {
	background-image: url("/common/images/side-usage-blog.png");
}
aside .usageBlock .movie h3 {
	background-image: url("/common/images/side-usage-movie.png");
}
aside .usageBlock .report p {
	display: flex;
	align-items: center;
	width: 100%;
	margin-bottom: 0;
}
aside .usageBlock .report p:first-child span:first-child {
	max-width: calc(100% - 4rem);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
aside .usageBlock .report p:first-child span:last-child {
    margin-left: .6rem;
    padding: .2rem .4rem;
    background-color: #74B208;
    color: #FFFFFF;
    font-size: 1.2rem;
    line-height: 1.2;
    white-space: nowrap;
}
aside .usageBlock .report p:first-child span.new {
	background-color: #E5C900;
	color: #222222;
}
aside .usageBlock h4 {
	margin-bottom: .25rem;
}
aside .usageBlock .report p:last-child {
	display: none;
}
aside .usageBlock .itemList {
	margin-bottom: 0;
	padding-left: 0;
	list-style: none;
}
aside .usageBlock .itemList li {
	margin-bottom: .6rem;
	padding: .6rem 1rem;
	background-color: #FFFFFF;
	border-left: .2rem solid #3187A5;
	color: #333333;
}
aside .usageBlock .movie .itemList li {
	border-left-color: #738A3F;
}
aside .usageBlock .itemList li:last-child {
	margin-bottom: 0;
}
aside .usageBlock .itemList li a {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
aside .usageBlock i.youtube {
	display: inline-block;
	margin: 0 .4rem;
	padding: .2rem .4rem;
	background-color: #D44642;
	color: #FFFFFF;
	font-size: 1rem;
	font-style: normal;
	line-height: 1;
	white-space: nowrap;
	vertical-align: middle;
}

/* cnavi Block */
aside .cnaviBlock {
	margin-bottom: 20px;
}
aside .cnaviBlock a {
	display: block;
	background: url("/common/banner/cnavi/icon-click.png") no-repeat 98% bottom;
	background-size: 28px;
	border: 1px solid #222222;
	color: #222222;
	text-decoration: none;
}
aside .cnaviBlock a:hover,
aside .cnaviBlock a:active,
aside .cnaviBlock a:focus {
	border-color: #0000FF;
}
aside .cnaviBlock h2 {
	margin-bottom: 0;
	padding: 10px;
}
aside .cnaviBlock h2 img {
	width: 60%;
}
aside .cnaviBlock p {
	margin-bottom: 0;
	padding: 100px 36px 10px 10px;
	background: url("/common/banner/cnavi/tmb-building.png") no-repeat center top;
	background-size: contain;
}

/* Promotion Block */
aside .promotionBlock {
	margin-bottom: 2rem;
	border: 5px solid #EBE7CA;
}
aside .promotionBlock h2 {
	margin-bottom: 0;
	padding: 1.5rem 1rem;
	background-color: #FBF6C9;
	font-size: 1.4rem;
	text-align: center;
}
aside .promotionBlock .inner {
	padding: 1.5rem 1rem;
	color: #333333;
}
aside .promotionBlock .inner h3 {
	margin: 1rem 0 2rem 0;
	color: #333333;
	text-align: center;
}
aside .promotionBlock .inner .checkList {
	margin-bottom: 2rem;
	padding-left: 0;
	list-style: none;
}
aside .promotionBlock .inner .checkList li {
	padding-left: 1.6rem;
	background: url("/common/images/icon-arrow-point.png") no-repeat left .4rem;
	font-size: 1.3rem;
}
aside .promotionBlock .inner .entryBtn {
	margin-bottom: 2rem;
}
aside .promotionBlock .inner .entryBtn a {
	display: block;
	padding: 1rem;
	border-radius: 6px 6px;
	background: linear-gradient(#FFD600, #E8C300);
	color: #222222;
	font-size: 1.6rem;
	text-align: center;
	transition: .3s ease-in-out;
}
aside .promotionBlock .inner .entryBtn a:hover {
	background: linear-gradient(#FFDE33, #EDCF33);
	text-decoration: none;
}
aside .promotionBlock .inner .naviList {
	margin-bottom: 0;
	padding-left: 0;
	list-style: none;
}
aside .promotionBlock .inner .naviList li {
	padding-left: 2rem;
	background: url("/common/images/icon-arrow-link.png") no-repeat left .5rem;
}
aside .promotionBlock .inner .naviList li a {
	color: #008DC9;
}

/* cateNav, cmnNav, siteNav */
aside .cateNav,
aside .cmnNav,
aside .siteNav {
	margin-bottom: 2em;
	border: 1px solid #CCCCCC;
}
aside .cateNav:last-child,
aside .cmnNav:last-child,
aside .siteNav:last-child {
    margin-bottom: 0;
}
aside .cateNav h2,
aside .cmnNav h2,
aside .siteNav h2 {
	position: relative;
	margin-bottom: 0;
	font-size: 100%;
	line-height: 1.4;
}
aside .cateNav h2::before,
aside .cmnNav h2::before,
aside .siteNav h2::before {
	content: '';
	position: absolute;
	left: 0;
	width: 2em;
}

/* Category */
aside .cateNav h2 {
	background-color: #F9F7EE;
	border-bottom: 4px solid #C2B372;
}
aside .cateNav h2::before {
	bottom: -4px;
	height: 4px;
	background-color: #2D4D90;
}
aside .cateNav h2 span {
	display: block;
	padding: 14px 20px 14px 15px;
}
aside .cateNav h2 a {
	display: block;
	padding: 14px 20px 14px 15px;
	background: url("/image/toppage/arrow_01.gif") no-repeat 97% center;
	color: #333333;
	text-decoration: none;
}
aside .cateNav ul {
	position: relative;
	margin: 0;
    padding-left: 0;
	list-style: none;
}
aside .cateNav ul li {
	margin-bottom: 0;
}
aside .cateNav ul li + li {
    border-top: 1px dotted #CCCCCC;
}
aside .cateNav ul a {
	display: block;
	padding: 10px 15px 10px 24px;
	background: url("/image/toppage/arrow_01.gif") no-repeat 10px 1.2em;
	text-decoration: none;
}
aside .cateNav ul a:hover {
	background-color: #FAFAFA;
}
aside .cateNav ul li.last {
    margin-bottom: 0;
    padding: 10px 15px 10px 0;
    text-align: right;
}
aside .cateNav ul li.last a {
    display: inline;
    padding: 0 0 0 2rem;
    background: none;
}
aside .cateNav ul li.last .linkList {
    display: inline-block;
    margin-bottom: 0;
}

/* Common Nav */
aside .cmnNav h2 {
	padding: 14px 15px;
	background-color: #F2F7ED;
	border-bottom: 2px solid #CCCCCC;
}
aside .cmnNav h2::before {
	bottom: -2px;
	height: 2px;
	background-color: #2C653C;
}
aside .cmnNav ul.textList {
    margin-bottom: 0;
	padding: 15px 15px 15px 1.75em;
}
aside .cmnNav ul.textList li.last {
    margin-bottom: 0;
    padding-top: 15px;
    border-top: 1px dotted #CCCCCC;
    list-style: none;
    text-align: right;
}
aside .cmnNav ul.textList li.last .linkList {
    display: inline-block;
    margin-bottom: 0;
}
aside .cmnNav ul.textList li.movie {
	margin-left: -1.6rem;
	padding-left: 2.6rem;
	background: url("/common/images/side-usage-movie.png") no-repeat left .1em;
	list-style: none;
}
aside .cmnNav ul.textList li.hr {
	margin-bottom: 1rem;
	padding-bottom: 1rem;
	border-bottom: 1px dotted #CCCCCC;
}
aside .cmnNav i.youtube {
	display: inline-block;
	margin: 0 .4rem;
	padding: .2rem .4rem;
	background-color: #D44642;
	color: #FFFFFF;
	font-size: 1rem;
	font-style: normal;
	line-height: 1;
	white-space: nowrap;
	vertical-align: middle;
}

/* Site Nav */
aside .siteNav {
	border-bottom: 0;
}
aside .siteNav h2 {
	padding: 14px 15px;
	background-color: #F2F2F2;
	border-bottom: 2px solid #CCCCCC;
}
aside .siteNav h2::before {
	bottom: -2px;
	height: 2px;
	background-color: #999999;
}
aside .siteNav ul {
	margin: 0;
    padding-left: 0;
	list-style: none;
}
aside .siteNav ul li {
    width: 100%;
    margin: 0;
    border-bottom: 1px solid #CCCCCC;
}
aside .siteNav ul li a {
    display: flex;
    align-items: center;
    min-height: 56px;
    width: 100%;
    padding: 10px 15px 10px 56px;
    background-color: #FFFFFF;
    background-position: 10px center;
    background-repeat: no-repeat;
    box-sizing: border-box;
    line-height: 1.4;
    text-decoration: none;
}
aside .siteNav ul a:hover {
	background-color: #FAFAFA;
}
aside .siteNav ul li a.form {
    background-image: url("/common/images/siteNav-icon-form.png");
}
aside .siteNav ul li a.doc {
    background-image: url("/common/images/siteNav-icon-doc.png");
}
aside .siteNav ul li a.service {
    background-image: url("/common/images/siteNav-icon-service.png");
}

/* Service Navi Block */
.serviceNaviBlock {
	margin-bottom: 2rem;
}
.serviceNaviBlock ul {
	margin-bottom: 0;
	padding-left: 0;
	list-style: none;
}
.serviceNaviBlock ul li {
	margin-bottom: 0;
	background: url("/common/images/icon-arrow-link.png") no-repeat 99.5% center;
}
.serviceNaviBlock ul li + li {
	margin-top: 1rem;
}
.serviceNaviBlock ul li a {
	display: flex;
	align-items: center;
	height: 66px;
	padding: 1rem 2rem 1rem 10rem;
	background-position: 10px center;
	background-repeat: no-repeat;
	border: 2px solid #DDDDDD;
	border-radius: 2px 2px;
	color: #222222;
}
.serviceNaviBlock ul li a:hover {
	border-color: #CCCCCC;
	text-decoration: none;
}
.serviceNaviBlock ul li.partner a {
	background-image: url("/common/images/service-bnr-partner.png");
}
.serviceNaviBlock ul li.movie a {
	background-image: url("/common/images/service-bnr-movie.png");
}
.serviceNaviBlock ul li.tips a {
	background-image: url("/common/images/service-bnr-tips.png");
}
.serviceNaviBlock i.youtube {
	display: inline-block;
	margin: 0 .4rem;
	padding: .2rem .4rem;
	background-color: #D44642;
	color: #FFFFFF;
	font-size: 1rem;
	font-style: normal;
	line-height: 1;
	white-space: nowrap;
	vertical-align: middle;
}

/* Facebook Block */
.facebookBlock {
	margin-bottom: 2rem;
}

/* Banner Block */
.BannerBlock {
	margin-bottom: 2rem;
}
.BannerBlock ul {
	margin-bottom: 0;
	padding-left: 0;
	list-style: none;
}
.BannerBlock ul li {
	margin-bottom: 0;
}
.BannerBlock ul li + li {
	margin-top: 1rem;
}
.BannerBlock ul li a {
	display: block;
	height: 60px;
	padding: 1rem;
	border: 2px solid #DDDDDD;
	text-align: center;
}
.BannerBlock ul li a:hover {
	border-color: #CCCCCC;
}

/* Footer Block */
.footerBlock {
	display: flex;
	justify-content: space-between;
	align-items: center;
	align-content: center;
	padding: 1rem 0;
	border-top: 1px solid #CCCCCC;
}
.footerBlock .logo {
	flex: 0 1 202px;
	margin-bottom: 0;
}
.footerBlock .markList {
	margin-bottom: 0;
	padding-left: 0;
}
.footerBlock .markList li {
	display: inline-block;
	margin: 0 0 0 1rem;
}

/* 6: Footer
=========================================================================== */
footer {
	padding: 3rem 0;
	background-color: #202020;
	font-size: 1.4rem;
}
body > footer {
    width: 98rem;
    margin: 0 auto;
    padding: 0;
    border-top: 1px solid #ECE2B2;
}
body > footer .inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem;
    background-color: #FFFFFF;
    border-top: 1px solid #C1B26C;
}
footer .logo {
    margin-bottom: 0;
}
footer .footNavi {
	display: table;
    margin-bottom: 0;
    padding-left: 0;
}
footer .footNavi li {
    display: table-cell;
	position: relative;
    padding: 0 1rem;
    font-size: 1.2rem;
}
footer .footNavi li + li {
    margin: 0 .5rem;
	list-style: none;
}
footer .footNavi li:first-child::before {
	content: " | ";
	position: absolute;
	top: 0;
	left: 0;
}
footer .footNavi li::after {
	content: " | ";
	position: absolute;
	top: 0;
	right: 0;
}
footer .footMenu {
	display: table;
	margin: 0 auto 1.6rem auto;
	padding: 0;
	list-style: none;
}
footer .footMenu li {
	display: table-cell;
	margin: 0;
	padding: 0 1.5rem;
}
footer .footMenu li a {
	color: #FFFFFF;
}
footer small {
	display: block;
	font-size: 1.1rem;
	text-align: center;
	color: #FFFFFF;
}
body > footer small {
    padding: .4rem 1rem;
}
footer .footMenu li a {
	position: relative;
}
footer .footMenu li a::after {
	content: '';
	position: absolute;
	bottom: -4px;
	right: 0;
	width: 100%;
	height: 1px;
	background-color: #2C3840;
	transform: scale(0, 1);
	transform-origin: center top;
	transition: transform .3s;
}
footer .footMenu li a::after {
	background-color: #FFFFFF;
}
footer .footMenu li a:hover::after,
footer .footMenu li a:active::after,
footer .footMenu li a:focus::after {
	transform: scale(1, 1);
}
footer .footMenu li a:hover,
footer .footMenu li a:active,
footer .footMenu li a:focus {
	text-decoration: none;
}


/* 7: Module
=========================================================================== */

/* List
--------------------------------------------------------------------------- */
ul.note,
ol.noteNo {
    margin-bottom: 1rem;
	padding-left: 0;
	list-style: none;
    font-size: 1.2rem;
}
.note li {
	position: relative;
	padding-left: 2.5rem;
    color: #666666;
}
.note li::before {
	content: "\203B";
	position: absolute;
	top: 0;
	left: .3rem;
	width: 2em;
}
ol.noteNo li {
	counter-increment: num;
	position: relative;
	padding-left: 3rem;
}
ol.noteNo li::before {
	content: "\203B" counter(num) "";
	position: absolute;
	top: 0;
	left: 0;
	width: 3rem;
}

/* Navigation
--------------------------------------------------------------------------- */
/* Pankuzu */
.pankuzu {
	display: block;
	margin-bottom: 20px;
	padding: 12px 4px;
	border-bottom: 1px solid #e0e0e0;
}
.pankuzu p {
	margin: 0;
	font-size: 91.7%;
}

/* Anchor Top
----------------------------------------------------------------------------- */
.anchorTop a:hover::before,
.anchorTop a:active::before,
.anchorTop a:focus::before {
	border-color: #00A1B9;
}
.anchorTop {
    margin-top: 1rem;
	text-align: right;
}
.anchorTop a {
	display: inline-block;
	position: relative;
	padding-left: 2rem;
}
.anchorTop a::before,
.anchorTop a::after {
	content: '';
	display:block;
	position: absolute;
}
.anchorTop a::before {
	top: 50%;
	left: 0;
	width: 14px;
	height: 14px;
    margin-top: -.7rem;
    background-color: #3D4453;
}
.anchorTop a::after {
	top: 50%;
	left: .4rem;
	width: 6px;
	height: 6px;
	margin-top: -.2rem;
	border: 2px solid #FFFFFF;
	border-left-width :0;
	border-top-width: 0;
	transform: rotate(-135deg);
	transition: .3s ease-in-out;
}

/* Anchor Link */
.anchorNav {
	margin: 2em 0;
	padding: 20px;
	border: 1px solid #cccccc;
}
.anchorNav h2 {
    margin-bottom: 1rem;
    font-size: 1.6rem;
}
.anchorNav ul {
	margin: 0;
	list-style: none;
	overflow: hidden;
	zoom: 1;
}
.anchorNav ul:after {
	content: '';
	clear: both;
	display: block;
}
.anchorNav ul li {
	float: left;
    position: relative;
	width: 33%;
	margin: 0.25em 0;
	padding: 0 22px 0 24px;
}
.anchorNav ul li::before,
.anchorNav ul li::after {
    content: '';
	display:block;
    position: absolute;
    top: 50%;
    left: 0;
}
.anchorNav ul li::before {
    width: 1.6rem;
    height: 1.6rem;
    margin-top: -.8rem;
    background-color: #2B4B92;
    border-radius: 50%;
}
.anchorNav ul li::after {
	width: .6rem;
	height: .6rem;
	margin: -.4rem 0 0 .5rem;
	border: 2px solid #FFFFFF;
	border-left-width :0;
	border-top-width: 0;
	transform: rotate(45deg);
}
.anchorNav ul *:last-child {
	margin-bottom: 0;
}

/* Page Top */
.pageTop {
    background-color: #FFFFFF;
	text-align: center;
}
body > .pageTop {
    width: 980px;
    margin: 0 auto;
}
.pageTop a {
	display: inline-block;
	height: 4.6rem;
	padding: 1rem;
}
.pageTop a span {
	position: relative;
	display: inline-block;
	width: 4.6rem;
	height: 2.8rem;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
}
.pageTop a span::before {
	content: '';
	display:block;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 3.2rem;
	height: 3.2rem;
	margin: -.6rem 0 0 -1.6rem;
	border: .4rem solid #2C3840;
	border-left-width :0;
	border-top-width: 0;
	transform: rotate(-135deg);
	transition: .3s ease-in-out;
}
.pageTop a:hover span::before,
.pageTop a:active span::before,
.pageTop a:focus span6::before {
	border-color: #00A1B9;
}

/* Link List  */
.linkList {
    margin-bottom: 1rem;
    padding-left: 0;
    list-style: none;
}
.linkList li {
    margin-bottom: 1.5rem;
}
.linkList li:last-child {
    margin-bottom: 0;
}
.linkList p {
    margin-bottom: .5rem;
}
.linkList a.navilink {
	position: relative;
	padding-left: 2rem;
}
.linkList a.navilink::before,
.linkList a.navilink::after {
	content: '';
	display:block;
	position: absolute;
}
.linkList a.navilink::before {
	top: 50%;
	left: 0;
	width: 14px;
	height: 14px;
    margin-top: -.7rem;
    background-color: #3D4453;
}
.linkList a.navilink::after {
	top: 50%;
	left: .3rem;
	width: 6px;
	height: 6px;
	margin-top: -.3rem;
	border: 2px solid #FFFFFF;
	border-left-width :0;
	border-top-width: 0;
	transform: rotate(-45deg);
}

/* Button
--------------------------------------------------------------------------- */
.btnBlock {
    display: flex;
    justify-content: center;
    margin: 6rem 0;
}
.btnBlock > p {
    margin-bottom: 0;
}
.btnBlock > p + p {
    margin-left: 4rem;
}
.btnBlock > p a {
    max-width: 365px;
	display: inline-block;
	padding: 1.4rem 4rem;
	border-radius: .6rem;
	color: #222222;
	font-size: 1.6rem;
	text-align: center;
	transition: .3s ease-in-out;
}
.btnBlock > p a:hover {
	text-decoration: none;
}

/* Versatility */
.confirmBtn a {
	background: linear-gradient(#FFD600, #E8C300);
}
.confirmBtn a:hover {
	background: linear-gradient(#FFDE33, #EDCF33);
}
.choiceBtn a {
	background: linear-gradient(#FFFFFF, #F0F0F0);
    border: 1px solid #CCCCCC;
}
.choiceBtn a:hover {
	background: linear-gradient(#F0F0F0, #EEEEEE);
    
}

/* Popup */
a.popup {
	display: inline-block;
	position: relative;
    padding-right: 2.6rem;
}
a.popup::before {
	content: '';
	display:block;
	position: absolute;
	top: 50%;
	right: 0;
	width: 12px;
	height: 12px;
	margin-top: -3px;
	border: 1px solid #2c3840;
	transition: .3s ease-in-out;
}
a.popup::after {
	content: '';
	display:block;
	position: absolute;
	top: 50%;
	right: 5px;
	width: 12px;
	height: 12px;
	margin-top: -8px;
	border: 1px solid #2c3840;
	transition: .3s ease-in-out;
}
/* Icon */
span.icon-pdf {
    display: inline-block;
    margin-left: .5rem;
    padding: .2rem .4rem;
    background-color: #F92803;
    color: #FFFFFF;
    font-size: 1.1rem;
    line-height: 1;
}


/* Block parts
--------------------------------------------------------------------------- */
.frmBlock {
    padding: 10px;
    border: 1px solid #CCC;
    margin: 0 0.6em 1em 0.6em;
    box-sizing: border-box;
}
.frmBlock :last-child {
    margin-bottom: 0;
}

/* Adjusting parts
--------------------------------------------------------------------------- */
.clearfix {
    display: block;
}
.clearfix::after {
    content: '';
    display: block;
    clear: both;
}
.alignL {
	text-align: left!important;
}
.alignC {
	text-align: center!important;
}
.alignR {
	text-align: right!important;
}
.valignT {
	vertical-align: top!important;
}
.valignM {
	vertical-align: middle!important;
}
.valignB {
	vertical-align: bottom!important;
}
.mb00 {
	margin-bottom: 0!important;
}
.mb02 {
	margin-bottom: 2rem!important;
}
.mb03 {
	margin-bottom: 3rem!important;
}
.mb04 {
	margin-bottom: 4rem!important;
}