@charset "utf-8";

.s_visual {position:relative;width:100%;height:300px;background-repeat:no-repeat;background-position:50% 0;display:flex;align-items:center}
.s_visual.s_bg1 {background-image:url(/img/sub/s_visual1.jpg);background-size:cover}
.s_visual.s_bg2 {background-image:url(/img/sub/s_visual2.jpg);background-size:cover}
.s_visual.s_bg3 {background-image:url(/img/sub/s_visual3.jpg);background-size:cover}
.s_visual.s_bg4 {background-image:url(/img/sub/s_visual4.jpg);background-size:cover}
.s_visual.s_bg5 {background-image:url(/img/sub/s_visual5.jpg);background-size:cover}
.s_visual.s_bg6 {background-image:url(/img/sub/s_visual6.jpg);background-size:cover}

.sv_tit {position:relative;text-align:right;color:#fff;}
.sv_tit img {width:40%;filter:drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.3))}

@media (max-width:976px) {
.s_visual {height:250px}
.sv_tit img {width:40%}
}

@media (max-width:640px) {
.s_visual {height:200px}
}

#subContent {position:relative;clear:both}

#s_navi {position:relative;float:left;width:20%;margin-top:-85px}
#s_navi h2 {text-align:center;color:#fff;height:125px;line-height:125px;font-size:1.875em;
background: #00C8AA;
background: linear-gradient(135deg, rgba(0, 200, 170, 1) 30%, rgba(230, 240, 100, 1) 100%);
text-shadow:2px 2px 2px rgba(0, 0, 0, 0.2)
}
#s_navi ul li {border:1px solid #d7d7d7;margin-top:-1px}
#s_navi ul li a {display:block;line-height:55px;color:#484848;padding:0 25px;background:url("/img/sub/arrow.png") no-repeat 92% center}
#s_navi ul li a:hover {color:#0386d6}

.ssmenu {background-color:#f9fafc;font-size:0.9em}

#page01 a.menu1,
#page02 a.menu2,
#page03 a.menu3,
#page04 a.menu4,
#page05 a.menu5,
#page06 a.menu6,
#page07 a.menu7,
#page08 a.menu8,
#page09 a.menu9,
#page10 a.menu10 {display:block;color:#0386d6;background-image:url("/img/sub/arrowOn.png");}

.sub_top {display:none;position:relative;float:left;width:100%;border-bottom:1px solid #ddd}
.sub_top .sub_top_in {position:relative;z-index:50;margin:0 auto}
.snb:after {content:".";display:block;height:0;clear:both;visibility:hidden}
.snb>div {float:left;position:relative}
.snb .home>a {display:block;width:60px;height:60px;text-align:center;font-size:0;background:url("/img/sub/ico_home.png") no-repeat center;background-size:100%;}
.snb>.depth1_area, .snb>.depth2_area {width:230px}
.snb>.depth1_area, .snb>.depth2_area a {color:#0386d6}
.snb .open_depth {display:block;position:relative;height:60px;line-height:60px;padding:0 20px;border-right:1px solid #ccc;background-color:#fff;color:#555;font-size:14px;white-space:nowrap}
.snb .open_depth.on {background-color:#fff}
.snb .open_depth:after {content:"\e874";display:inline-block;position:absolute;top:0;right:14px;font-family:'Linearicons-Free';font-size:14px;line-height:60px;color:#9a9a9a}
.snb .open_depth.on:after {content:"\e873";top:0}
.snb .smenu {display:none;position:absolute;top:60px;left:0;width:100%}
.snb .smenu>li>a {display:block;padding:12px 5px 13px 20px;border:1px solid #ccc;border-top:none;background-color:#f4f4f4;color:#555;font-size:14px}
.snb .smenu>li>a:hover {background-color:#fff;color:#222}
.snb .smenu>li.ssmenu>a {background-color:#f9fafc}

@media screen and (max-width:976px) {
.sub_top {display:block}
.sub_top h2 {display:none;}
#s_navi {display:none}
.sub_top {height:46px;background:#f4f4f4;border-bottom:1px solid #d5d5d5}
.snb {padding-left:45px}
.snb .home {position:absolute;top:0;left:0;z-index:10}
.snb .home>a {width:45px;height:45px}
.snb .home>a:before {font-size:13px;line-height:13px}
.snb>.depth1_area, .snb>.depth2_area {width:50%}
.snb .open_depth {height:45px;line-height:45px;padding:0px 12px 0px 12px;font-size:13px;overflow:hidden;text-overflow:ellipsis}
.snb .open_depth:after {/*top:13px;*/ right:6px;font-size:9px;line-height:45px}
.snb .open_depth.on:after {top:12px}
.snb .smenu {top:45px}
.snb .smenu>li>a {padding:8px 5px 9px 7px;font-size:13px}
}

@media screen and (min-width:976px) and (max-width:1216px) {/* (min-width:977px) and (max-width:1216px) */
.sub_top .sub_top_in { max-width:100%}
}

@media screen and (max-width:767px) {
.sub_top {height:46px;background:#f4f4f4;border-bottom:1px solid #d5d5d5}
.snb {padding-left:45px}
.snb .home {position:absolute;top:0;left:0;z-index:10}
.snb .home>a {width:45px;height:45px}
.snb .home>a:before {font-size:13px;line-height:13px}
.snb>.depth1_area, .snb>.depth2_area {width:50%}
.snb .open_depth {height:45px;line-height:45px;padding:0px 12px 0px 12px;font-size:12px;overflow:hidden;text-overflow:ellipsis}
.snb .open_depth:after {/*top:13px;*/ right:6px;font-size:9px;line-height:45px}
.snb .open_depth.on:after {top:12px}
.snb .smenu {top:45px}
.snb .smenu>li>a {padding:8px 5px 9px 7px;font-size:12px}
}

#pageWrap {position:relative;float:right;width:75%;overflow:hidden;padding:5% 0;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box}
#pageCont {position:relative;min-height:500px;overflow:hidden;padding:30px 0}
#subTitle {padding-bottom:25px;border-bottom:2px solid #004181}
#subTitle p {color:#8b8b8b;font-size:0.93em}
#subTitle img {width:30%;margin-bottom:0.5rem}

@media screen and (max-width:976px) {
#pageWrap {width:100%;margin:0 auto;clear:both;padding:5% 3%}
}

@media screen and (max-width:767px) {
#subTitle p {color:#8b8b8b;font-size:1em}
#subTitle h3 img {height:22px;margin-bottom:5px}
}

@media screen and (max-width:568px) {
#pageWrap {padding:7% 3%}
}

.btn_app {width:100px;display:block;line-height:30px;background-color:#004181;color:#fff;text-align:center}
.btn01 {width:200px;display:block;line-height:50px;background-color:#004181;color:#fff;text-align:center}
.btn02 {width:200px;display:block;line-height:50px;border:3px solid #004181;color:#004181;text-align:center}
.btn04 {width:200px;display:block;line-height:50px;background-color:#44aa00;color:#fff;text-align:center}
.btn05 {display:inline-block;line-height:30px;color:#fff;background-color:#1582c5;text-align:center;margin:0 auto;padding:10px 30px}
.btn06 {display:inline-block;line-height:30px;width:200px;color:#fff;background-color:#004181;text-align:center;font-size:1.0em;margin:0 auto;padding:10px 30px}
.btn07 {font-size:0.9em;display:inline-block;width:100px;line-height:20px;margin:0 auto;padding:10px auto;background-color:#004181;color:#fff;text-align:center}
.btn08 {width:80px;color:#fff;font-size:0.8em;text-align:center;border-radius:*20px;padding:2px 5px}

#tab_container2 {width:100%;height:auto;overflow:hidden}
#tab_container2 ul.tabs2 {margin:0;padding:0;list-style:none;width:100%;height:60px;border-left:1px solid #d7d7d7}
#tab_container2 ul.tabs2 li {position:relative;float:left;width:25%;text-overflow:ellipsis;overflow:hidden}
#tab_container2 ul.tabs2 li a {text-decoration:none;height:60px;line-height:60px;display:block;font-weight:350;background:#fff;color:#2b2b2b;border:1px solid #d7d7d7;box-sizing:border-box;border-left:0;padding:0 8%}
#tab_container2 ul.tabs2 li.active a {color:#fff;background:#44aa00;font-weight:400;border:1px solid #44aa00}
#tab_container2 ul.tabs2 li a:before {content:"\e876";display:inline-block;position:absolute;top:0;right:14px;font-family:'Linearicons-Free';font-size:14px;line-height:60px;color:#9a9a9a}
#tab_container2 ul.tabs2 li.active a:before {content:"\e874";color:#fff}
#tab_container2 .tab_container2 {clear:both;float:left;margin:0;width:100%}
#tab_container2 .tab_content2 {margin:0 0 0 0px}
#tab_container2 .tab_content2 ul {}
#tab_container2 ul.tabs2.col3 li {width:33%}
#tab_container2 ul.tabs2.pro2 li {width:24%}
#tab_container2 ul.tabs2.pro2 li:nth-child(2) {width:28%}

@media screen and (max-width:767px) {
#tab_container2 ul.tabs2 {height:45px}
#tab_container2 ul.tabs2 li a {height:45px;line-height:45px}
#tab_container2 ul.tabs2 li a:before {line-height:45px}
#tab_container2 ul.tabs2.col4 li {width:50%}
#tab_container2 ul.tabs2.col4 li:nth-child(3) a {border-left:1px solid #d7d7d7}
#tab_container2 ul.tabs2.col4 li:nth-child(1) a,
#tab_container2 ul.tabs2.col4 li:nth-child(2) a {border-bottom:0 !important}
#tab_container2 ul.tabs2.pro2 li {width:50%}
#tab_container2 ul.tabs2.pro2 li:first-child {width:50%}
#tab_container2 ul.tabs2.pro2 li:nth-child(2) {width:50%}
}

@media screen and (max-width:480px) {
#tab_container2 ul.tabs2 {height:40px}
#tab_container2 ul.tabs2 li a {height:40px;line-height:40px}
#tab_container2 ul.tabs2 li a:before {line-height:40px}
}