@charset "utf-8";
@import url(https://fonts.googleapis.com/css?family=Roboto);
html,body,h1,h2,h3,h4,h5,h6,p,span,div,object,iframe,em,ul,ol,li,label,dl,dt,dd,form,label,table,tbody,tr,th,td { margin:0; padding:0; border:0; outline:0; font-weight:inherit; font-style:inherit; font-family:inherit; list-style-type:none; } html { overflow-y:scroll; } img { border:none; vertical-align:bottom; line-height:0; font-size:0; user-select:none; -webkit-user-select:none; -moz-user-select:none; -khtml-user-select:none; -webkit-user-drag:none; -khtml-user-drag:none; } body { background: #ffffff; margin:0 !important; color: #0f161a; line-height:1.5; letter-spacing: 0; font-family: Roboto,Yu Gothic,YuGothic,'游ゴシック Medium','游ゴシック体',sans-serif; } .clearfix { zoom:1; min-height: 1px; } .clearfix:after { content: " "; display: block; clear: both; height: 0; visibility: hidden; font-size: 0.1em; line-height: 0; } .clearboth { clear: both; height: 1px; } *html .clearfix{ height: 1px; /*\*//*/ height: auto; overflow: hidden; /**/ }

h1 { font-size: 16px; line-height: 1.0; }
h2 { font-size: 48px; line-height: 1.2; margin: 0 0 24px; }
h3 { font-size: 30px; line-height: 1.2; margin: 0 0 48px; }
h4 { font-size: 24px; line-height: 1.2; font-weight: bold; margin: 0 0 30px; }
h5 { font-size: 18px; line-height: 1.2; font-weight: bold; margin: 24px 0 12px; }
p, dt, dd, th, td { font-size: 16px; }
a { text-decoration: none; color: #0f161a; }

/* --------------------------------------------------------------------------
 header / footer / navigation
-------------------------------------------------------------------------- */

#header { width: 100%; background: #ffffff; padding: 16px 0; }
#header.regist { border-bottom: solid 1px #f8f8f8; }
#header h1 { float: left; padding-left: 50px; }
#header h1 a:hover { filter:alpha(opacity=100); -moz-opacity:1.0; opacity:1.0; }
#header .menu { float: right; padding-right: 50px; }
#header li { float: left; margin-left: 10px; }
#header li:first-child { margin: 0; }
#header li a {
	display: block;
	color: #40b2f3;
	border: solid 1px #40b2f3;
	border-radius: 4px; -webkit-border-radius: 4px;
	-moz-border-radius: 4px; -ms-border-radius: 4px;
	padding: 10px 20px;
}
#header li a:hover { background: #40b2f3; color: #ffffff; }
#header li:last-child a { color: #ffffff; background: #33be6a; border: solid 1px #33be6a; }
#header li:last-child a:hover { background: #2bb160; border: solid 1px #2bb160; }

#footer {
	position: relative;
	width: 100%;
	height: 40px;
	padding: 40px 0 20px;
	background: #ffffff;
	border-top: solid 2px #f8f8f8;
}
#footer .lnk { float: left; padding-left: 50px; }
#footer .lnk a { margin: 0 20px; font-size: 14px; }
#footer .lnk a:hover { filter:alpha(opacity=70); -moz-opacity:0.70; opacity:0.7; }
#footer .copyright { float: right; padding-right: 50px; font-size: 12px; }

/* --------------------------------------------------------------------------
 common settings
-------------------------------------------------------------------------- */

#container { position: relative; width: 100%; }
#container.dark { background: #090e11; color: #ffffff; }
#container.light { background: #f8f8f8; padding: 0 0 50px; }
#container.gradation { background: url(../img/gradation.png) bottom left repeat-x #f8f8f8; }
#content { position: relative; width: 1096px; margin: 0 auto; padding: 80px 0 0; }
#content.contact { text-align: center; padding: 36px 0 48px; margin: 0 auto; }

p.sign { padding: 0 0 80px; }
p.caution { position: absolute; bottom: 20px; right: 72px; z-index: 999; color: #e8e8e8; }

#container.dark.main {
	background: url(../img/main.jpg) top center no-repeat #090e11;
	height: 700px;
	overflow: hidden;
}
#content.no1 {
	background: url(../img/base_no1.jpg) bottom center no-repeat;
	padding: 70px 0 130px;
}
#container.no2 {
	background: url(../img/base_no2.jpg) top left no-repeat #0f161a;
	padding: 70px 0 120px;
	color: #ffffff;
}
#content.right { width: 420px; padding-left: 676px; }
#container.no3 {
	background: url(../img/base_no3.jpg) top right no-repeat;
	padding: 70px 0 120px;
}
#container.no4 {
	background: url(../img/base_no4.jpg) top center no-repeat #f8f8f8;
	padding: 70px 0 120px;
}

h5.term { border-bottom: solid 1px #0f161a; margin: 60px 0 16px; padding: 0 0 10px; }
table {
	width: 100%;
	border: solid 1px #e8e8e8;
	border-collapse: collapse;
	border-spacing: 0;
	border-width: 1px;
	margin: 20px 0 0;
	background: #ffffff;
}
table th {
	width: 200px;
	padding: 10px 0 10px 20px;
	border: solid 1px #e8e8e8;
	border-width: 0 0 1px 0;
	border-collapse: collapse;
	text-align: left;
	white-space: nowrap;
	vertical-align: top;
	background: #fbfbfb;
}
table td {
	width: 400px;
	padding: 10px 0 10px 20px;
	border: solid 1px #e8e8e8;
	border-width: 0 0 1px 0;
	border-collapse: collapse;
}

/* --------------------------------------------------------------------------
 new regist
-------------------------------------------------------------------------- */

.member {
	width: 600px;
	margin: 0 auto;
	padding: 10px 20px;
	background: #fbfbfb;
	border: solid 1px #e8e8e8;
	border-radius: 4px; -webkit-border-radius: 4px;
	-moz-border-radius: 4px; -ms-border-radius: 4px;
}
.member dt {
	display: table-cell;
	vertical-align: middle;
	width: 160px;
	border-right: solid 1px #e8e8e8;
}
.member dd { display: table-cell; vertical-align: middle; padding-left: 20px; }

#stepbox {
	width: 960px;
	margin: 30px auto;
	background: #ffffff;
	border: solid 1px #e0dddd;
	border-radius: 4px; -webkit-border-radius: 4px;
	-moz-border-radius: 4px; -ms-border-radius: 4px;
	box-shadow: 0 3px 4px 0 rgba(0,0,0,0.1); -webkit-box-shadow: 0 3px 4px 0 rgba(0,0,0,0.1);
	-moz-box-shadow: 0 3px 4px 0 rgba(0,0,0,0.1); -ms-box-shadow: 0 3px 4px 0 rgba(0,0,0,0.1);
}
#stepbox .step {
	display: table-cell;
	width: 160px;
	height: 100%;
	background: #f3f3f3;
	border-radius: 3px 0 0 3px; -webkit-border-radius: 3px 0 0 3px;
	-moz-border-radius: 3px 0 0 3px; -ms-border-radius: 3px 0 0 3px;
	padding: 40px 0 0;
	text-align: center;
	color: #40b2f3;
	font-size: 22px;
}
#stepbox .article { display: table-cell; padding: 40px; }
h3.regi { font-size: 28px; margin: 0 0 24px; }
#stepbox li { margin: 0 0 12px 1.6em; }
#stepbox .btn { margin: 20px 0 0; }
#stepbox .btn a.pdf {
	display: block;
	float: left;
	width: 542px;
	background: #33be6a;
	border-radius: 4px; -webkit-border-radius: 4px;
	-moz-border-radius: 4px; -ms-border-radius: 4px;
	padding: 12px 0;
	text-align: center;
	color: #ffffff;
	font-size: 20px;
	margin-right: 20px;
}
#stepbox .btn a.pdf:hover { background: #2bb160; }
#stepbox .btn a.gaar { display: block; float: left; margin: 14px 0 0; height: 39px; }
#stepbox .btn a.gaar:hover { filter:alpha(opacity=70); -moz-opacity:0.7; opacity:0.7; }

#stepbox .contact {
	width: 680px;
	padding: 20px;
	margin: 12px 0;
	border: solid 1px #e8e8e8;
	border-radius: 2px; -webkit-border-radius: 2px;
	-moz-border-radius: 2px; -ms-border-radius: 2px;
}

#stepbox .logins { margin: 20px 0 0; }
#stepbox .logins a {
	display: block;
	float: left;
	width: 320px;
	margin-right: 20px;
	padding: 6px 0;
	background: #40b2f3;
	border: solid 1px #40b2f3;
	border-radius: 4px; -webkit-border-radius: 4px;
	-moz-border-radius: 4px; -ms-border-radius: 4px;
	text-align: center;
	color: #ffffff;
	font-size: 18px;
}
#stepbox .logins a:hover { background: #ffffff; color: #40b2f3; }

.submit a {
	display: block;
	width: 640px;
	margin: 40px auto;
	padding: 12px 0;
	background: #33be6a;
	border-radius: 4px; -webkit-border-radius: 4px;
	-moz-border-radius: 4px; -ms-border-radius: 4px;
	text-align: center;
	color: #ffffff;
	font-size: 20px;
}
.submit a:hover { background: #2bb160; }

.contact a {
	display: block;
	width: 200px;
	margin: 10px auto;
	padding: 6px 0;
	border: solid 1px #000000;
	border-radius: 4px; -webkit-border-radius: 4px;
	-moz-border-radius: 4px; -ms-border-radius: 4px;
}

/* --------------------------------------------------------------------------
 img fadein
-------------------------------------------------------------------------- */

.fadeInDown {
	-webkit-animation-fill-mode:both;
	animation-fill-mode:both;
	-webkit-animation-duration:1s;
	animation-duration:1s;
	-webkit-animation-name: fadeInDown;
	animation-name: fadeInDown;
	visibility: visible !important;
}
@-webkit-keyframes fadeInDown {
	0% { opacity: 0; -webkit-transform: translateY(-10px); }
	100% { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes fadeInDown {
	0% { opacity: 0; -webkit-transform: translateY(-10px); transform: translateY(-10px); }
	100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); }
}

/* --------------------------------------------------------------------------
 icons
-------------------------------------------------------------------------- */

[class*="icon-"] {
	background: url(../img/icons.png) top left no-repeat;
	display: inline-block;
	vertical-align: baseline;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	height: 0;
	margin: 0;
}
.icon-logo {
	background-position: 0 0;
	width: 184px;
	height: 46px;
	background-size: 100% auto; -webkit-background-size:100% auto;
	-moz-background-size:100% auto; -ms-background-size:100% auto;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.icon-no1 {
	background-position: 0 -38px;
	width: 76px;
	height: 76px;
	margin: 0 0 30px;
	background-size: 200% auto; -webkit-background-size: 200% auto;
	-moz-background-size: 200% auto; -ms-background-size: 200% auto;
}
.icon-no2 {
	background-position: -76px -38px;
	width: 76px;
	height: 76px;
	margin: 0 0 30px;
	background-size: 200% auto; -webkit-background-size: 200% auto;
	-moz-background-size: 200% auto; -ms-background-size: 200% auto;
}
.icon-no3 {
	background-position: 0 -114px;
	width: 76px;
	height: 76px;
	margin: 0 0 30px;
	background-size: 200% auto; -webkit-background-size: 200% auto;
	-moz-background-size: 200% auto; -ms-background-size: 200% auto;
}
.icon-no4 {
	background-position: -76px -114px;
	width: 76px;
	height: 76px;
	margin: 0 0 30px;
	background-size: 200% auto; -webkit-background-size: 200% auto;
	-moz-background-size: 200% auto; -ms-background-size: 200% auto;
}
.icon-arr {
	background-position: 0 -190px;
	width: 76px;
	height: 38px;
	margin: 0 auto;
	background-size: 200% auto; -webkit-background-size: 200% auto;
	-moz-background-size: 200% auto; -ms-background-size: 200% auto;
}
.icon-blank {
	background-position: -28px -70px;
	width: 14px;
	height: 14px;
	margin-left: 3px;
	background-size: 400% auto; -webkit-background-size: 400% auto;
	-moz-background-size: 400% auto; -ms-background-size: 400% auto;
	vertical-align: text-top;
}


/* --------------------------------------------------------------------------
 fitting
-------------------------------------------------------------------------- */

.nopc { display: none !important; }
.flr { float: right; }
.fll { float: left; }
.fln { float: none; }
.tac { text-align: center; }
.tal { text-align: left; }
.tar { text-align: right; }
.bold { font-weight: bold; }
.nrml { font-weight: normal; }
.tdul { text-decoration: underline; }
.caption { font-size: 14px; line-height: 1.5em; color: #626368; }
.kome { display: inline-block; margin: 0 auto; text-align: left; }
.kome dt { line-height: 1.2em; font-size: inherit; }
.kome dd { line-height: 1.2em; margin: -1.2em 0 0 1.2em; font-size: inherit; }

ul.gist li { list-style-type: disc; margin: 0 0 4px 1em; padding: 0; font-size: inherit; }
ol.gist li { list-style-type: decimal; margin-left: 1.6em; padding: 0; font-size: inherit; }

.lts1 { letter-spacing: -0.1em; }
.lts2 { letter-spacing: -0.15em; }

#sp_container {
    display: none;
}

/* --------------------------------------------------------------------------
 News Release
-------------------------------------------------------------------------- */
#news_container { position: relative; width: 100%; }
#container.light { background: #f8f8f8; padding: 0 0 50px; }
#news_content { position: relative; width: 1096px; margin: 0 auto; padding: 80px 0 0; }
.news_items { padding-bottom: 80px; }
.news_left { text-align: left; padding: 10px 140px; }
.news_title { font-weight: bold; }
.news_title_p { font-weight: bold; font-size: 16px; }
.news_detail { padding-left: 0px; font-size: 14px; }

/* --------------------------------------------------------------------------
 banner area 20220107 add
-------------------------------------------------------------------------- */
#bnr_container {
background-color: #F8F8F8;
width: 100%;
padding: 50px 0 30px 0;
}
#bnr_container ul {
display: -webkit-flex;
display: flex;
-webkit-justify-content: center;
justify-content: center;
-webkit-align-items: center;
align-items: center;
flex-wrap: wrap;
max-width: 1660px;
margin: 0 auto;
}
#bnr_container ul li.no{
width: 300px;
height: 0px;
margin: 0 10px;
}
#bnr_container ul li a{
display: block;
width: 300px;
height: 150px;
margin: 0 10px 20px 10px;
opacity: 1.0;
transition: 0.3s;
}
#bnr_container ul li a:hover{
opacity: 0.8;
transition: 0.3s;
}