﻿@charset "utf-8";

/* sub */
#sub_container{font-size:1em;margin-top:100px;position:relative}

#sub_container .sub_visual{display:flex;position:relative;height:280px;overflow:hidden;}
#sub_container .sub_visual:after{content:'';position:absolute;left:0;bottom:0;width:100%;height:5px;background:url(/images/submenu_line.png) no-repeat;background-size:100% auto}
#sub_container .sub_visual .background{position:absolute;top:0;left:0;width:100%;height:100%;opacity:1;}
#sub_container .sub_visual .background::before {content: '';position:absolute;top:0;left:0;width:100%;height:100%;background-repeat:no-repeat; background-position:center;background-size:cover !important;transform: scale(1.15);animation: 2s subVisual cubic-bezier(0.39, 0.58, 0.57, 1) forwards;}
#sub_container .sub_visual1 .background::before{background-image:url(/images/sub_visual1.png);}
#sub_container .sub_visual2 .background::before{background-image:url(/images/sub_visual2.png);}
#sub_container .sub_visual3 .background::before{background-image:url(/images/sub_visual3.png);}
#sub_container .sub_visual4 .background::before{background-image:url(/images/sub_visual4.png);}
#sub_container .sub_visual5 .background::before{background-image:url(/images/sub_visual5.png);}
#sub_container .sub_visual6 .background::before{background-image:url(/images/sub_visual6.png);}
@keyframes subvisualFadeIn {
	to { opacity: 1; }
}
@keyframes subVisual {
    to { transform: scale(1); }
}
#sub_container .sub_visual .txt{position:absolute;left:0;top:35%;width:100%;text-align:center;color:#fff;z-index:2}
#sub_container .sub_visual .txt>h2{font-size:2.8em;font-weight:600;line-height:1}
#sub_container .sub_visual .txt>p{font-size:1.2em;font-weight:200;line-height:1.3em;margin-top:15px;color:rgba(255,255,255,0.85)}

#sub_container .submenu{position:relative;display:flex;justify-content:center;border-bottom:1px solid #d9d9d9;}
#sub_container .submenu .ul_submenu{display:flex;flex-wrap:wrap;justify-content:center;margin:10px 0}
#sub_container .submenu .ul_submenu li{display:inline-flex;align-items:center;}
#sub_container .submenu .ul_submenu li a{height:40px;line-height:40px;font-size:0.95em;font-weight:400;color:#333;border-radius:5px;padding:0 50px;margin:0 5px;transition:0.2s}
#sub_container .submenu .ul_submenu.sfont li a{font-size:0.9em;margin:0 2px;padding:0 22px;}
#sub_container .submenu .ul_submenu li a:hover, #sub_container .submenu .ul_submenu li a.active{background-color:#073190;font-weight:600;color:#fff}

#sub_container .contents{max-width:1500px;margin:70px auto 80px;min-height:350px;}
#sub_container .contents h3{font-size:2.4em;color:#000;font-weight:600;line-height:1;margin-bottom:50px}
#sub_container .contents h3 span{position:relative;display:inline-block;z-index:0}
/*#sub_container .contents h3 span:before{content:'';position:absolute;left:-3px;bottom:-1px;z-index:-1;background-color:#073190;width:calc(100% + 6px);height:10px;}*/
#sub_container .contents h4{font-size:1.8em;color:#007ac8;font-weight:500;letter-spacing:-0.03em;line-height:1;margin-bottom:30px}
#sub_container .contents h5{font-size:1.4em;color:#333;font-weight:600;line-height:1;margin-bottom:15px}

@media only screen and (max-width:1600px) {
	#sub_container .contents{margin:50px auto;padding:0 50px}
}
@media only screen and (max-width:1400px) {
	#sub_container .sub_visual .txt>h2{font-size:2.6em;}
	#sub_container .sub_visual .txt>p{font-size:1.1em;}

	#sub_container .contents h3{font-size:2.2em;}
	#sub_container .contents h4{font-size:1.7em;margin-bottom:20px}
	#sub_container .contents h5{font-size:1.3em;margin-bottom:10px;}
}
@media only screen and (max-width:1100px) {
	#sub_container .sub_visual{height:260px;}

	#sub_container .submenu{display:none}
	#sub_container .contents{margin:40px auto;padding:0 40px}
	#sub_container .contents h3{margin-bottom:40px;}
}
@media only screen and (max-width:760px) {
	#sub_container{margin-top:70px;}
	
	#sub_container .sub_visual{height:160px;}
	#sub_container .sub_visual:after{height:2px}
	#sub_container .sub_visual .txt>h2{font-size:2.0em;}
	#sub_container .sub_visual .txt>p{font-size:0.9em;margin-top:10px}
	/*#sub_container .sub_visual2 .background::before{background-position:100% 50%;}
	#sub_container .sub_visual4 .background::before{background-position:90% 50%;}

	#sub_container .sub_visual .txt{left:0;top:48%;width:100%;text-align:center;}
	#sub_container .sub_visual .txt>h2{font-size:1.8em;}
	#sub_container .sub_visual .txt>p{font-size:1em;margin-top:10px}*/
	
	#sub_container .contents{margin:30px auto;padding:0 30px}
	#sub_container .contents h3{font-size:1.6em;margin-bottom:30px;}
	#sub_container .contents h3 span:before{bottom:-2px;height:6px;}
	#sub_container .contents h4{font-size:1.3em;margin-bottom:15px}
	#sub_container .contents h5{font-size:1.2em;margin-bottom:7px;}
}

#sub_container .sub1_1{display:flex;justify-content:space-between;}
#sub_container .sub1_1>div{width:calc((100% - 100px) / 2)}

#sub_container .sub1_1>div:first-child>img{box-shadow:5px 5px 30px rgba(0,0,0,0.15)}
#sub_container .sub1_1>div:last-child>div{font-size:2.0em;line-height:1.4em;color:#073190;letter-spacing:-0.025em}
#sub_container .sub1_1>div:last-child>div>strong{color:#000}
#sub_container .sub1_1>div:last-child>p{word-break:keep-all;margin-top:20px;color:#333;line-height:1.5em;}
#sub_container .sub1_1>div:last-child>p:last-child{color:#666}

#sub_container .sub1_5{display:flex;justify-content:space-between;}
#sub_container .sub1_5>div:first-child{width:30%}
#sub_container .sub1_5>div:last-child{width:65%;}
#sub_container .sub1_5>div:first-child>p{color:#073190;font-size:1.5em;font-weight:400;margin:40px 0;word-break:keep-all;line-height:1.3em}
#sub_container .sub1_5 .contactus_list li{color:#333;}
#sub_container .sub1_5 .contactus_list li span.ico{background-color:#073190;border:none;border-radius:5px;}

@media only screen and (max-width:1600px) {
	#sub_container .sub1_1>div{width:calc((100% - 60px) / 2)}
}
@media only screen and (max-width:1400px) {
	#sub_container .sub1_1>div:last-child>div{line-height:1.3em;letter-spacing:0}
	
}
@media only screen and (max-width:1100px) {
	#sub_container .sub1_1{flex-wrap:wrap}
	#sub_container .sub1_1>div{width:100%;margin-bottom:40px;}
	#sub_container .sub1_1>div:last-child>div{font-size:1.8em;}
	
	#sub_container .sub1_5{flex-wrap:wrap;}
	#sub_container .sub1_5>div:first-child{width:100%;margin-bottom:30px;}
	#sub_container .sub1_5>div:last-child{width:100%;}
	#sub_container .sub1_5>div:first-child>p{margin:0 0 15px;font-size:1.3em}
}
@media only screen and (max-width:760px) {
	#sub_container .sub1_1>div{margin-bottom:20px;}
	#sub_container .sub1_1>div:last-child>div{font-size:1.3em;}
	#sub_container .sub1_1>div:last-child>p{margin-top:10px;}
	
	#sub_container .sub1_5>div:first-child{margin-bottom:20px;}
	#sub_container .sub1_5>div:first-child>p{font-size:1.2em}
}