@charset utf-8;

.wrap_100	{ width: 100%; padding: 0 calc((100% - 1400px) / 2); }
.wrap_box		{ width: 100%; max-width: 1400px; margin: 0 auto; }

.no_pc		{ display: none; }

h1			{ font-size: 20px; font-weight: 800; color: #3E3B72; padding: 100px 0 30px; }
h2			{ font-size: 40px; font-weight: 200; color: #333; padding: 0 0 50px; line-height: 50px; letter-spacing: -1px; }
h2 b			{ font-weight: 500; }

header		{ height: 1000px; background: #000 url(../image/header_bg.jpg) no-repeat 50% 50%; }
#section1		{ padding-bottom: 100px; }
#section2		{ background: #fff url(../image/section2_bg.jpg) no-repeat 50% 0%; }
#section3		{ }
#section4		{ padding-bottom: 100px; }
#section5		{ padding-bottom: 100px; background: #3E3B72 url(../image/section5_bg.jpg) no-repeat 50% 50%; background-size: cover; }
footer		{ background: #333333; padding-top: 50px !important; padding-bottom: 50px !important; color: #ccc; font-size: 15px; }

#section5 h1	{ color: #FF9700; }
#section5 h2	{ color: #FFF; }

.hder_logo	{ left: 50px; top: 50px; position: absolute; width: 150px; }
.hder_logo img	{ width: 100%;  }

.hder_menu	{ width: fit-content; margin: 0 auto; padding: 50px 0 300px; }
.hder_menu li	{ font-size: 18px; color: #FFF; font-weight: 800; float: left; margin: 0 60px; }
.hder_menu li a	{ color: #FFF; }
.hder_txt1		{ width: 100%; color: #FFF; font-size: 30px; font-weight: 300; text-align: left; letter-spacing: 2px; text-transform : uppercase; }
.hder_txt1 b	{ font-weight: 800; color:#ff9700}
.hder_txt2		{ width: 100%; margin: 30px auto 150px; color: #FFF; font-size: 50px; font-weight: 100; text-align: left; letter-spacing: -1px; line-height: 120%; }
.hder_txt3		{ width: 100%; color: #FFF; font-size: 20px; font-weight: 200; text-align: left; }

.se1_box		{ border: 1px #CCCCCC solid; border-radius: 10px; overflow: hidden; padding: 60px 0; }
.se1_box li		{ float: left; width: calc(100% / 3); border-left: 1px #EEE solid; text-align: center; color: #333; }
.se1_box li:first-child	{ border-left: 0; }
.se1_box li	 b	{ display: block; font-size: 20px; }
.se1_box li	 img	{ width: 90px; height: 90px; margin: 40px 0; }
.se1_box li	 span	{ display: block; font-size: 15px; line-height: 150%; }
.se1_box li:hover b { color: #FF9700; -webkit-transition: 0.5s all ease; transition: 0.5s all ease; }

.se2_box1		{ overflow: hidden; margin-bottom: 30px; }
.se2_box1 li	{ float: left; font-size: 15px; border: 1px #CCCCCC solid; background-color: #FFF; padding: 7px 13px 5px; margin-right: 10px; border-radius: 5px; cursor: pointer;}

.se2_sbox		{ overflow: hidden;}
.se2_sbox li	{ float: left; width: calc((100% - 40px) / 4); height: 500px; border: 1px #CCCCCC solid; background: #FAFAFA; text-align: center; color: #333; margin-left: calc(40px / 3); background-repeat: no-repeat; background-size: 100%; background-position: 0 0; cursor: pointer;}
.se2_sbox li:nth-child(4n+1)	{ margin-left: 0; }
.se2_sbox li span	{ display: none; }
.se2_sbox li:hover b	{ display: block; padding-top: 230px; margin-bottom: 10px; }
.se2_sbox li:hover span{ display: block; width: 100%; height: 500px; background-color: rgba(0,0,0,.7); color: #FFF; }
.sbox2{ display: none;}
.se3_box		{ overflow: hidden; }
.se3_box li		{ float: left; width: calc((100% - 40px) / 4); border: 1px #EEE solid; background: #FAFAFA; text-align: center; color: #333; border-radius: 5px; padding: 50px 0; margin-left: calc(40px / 3); margin-bottom: 13px; }
.se3_box li:nth-child(4n+1)	{ margin-left: 0; }
.se3_box li	 img	{ width: 80px; height: 80px; margin: 0 auto; }
.se3_box li img.out { display: block; }
.se3_box li img.over { display: none; }
.se3_box li:hover img.out { display: none; }
.se3_box li:hover img.over { display: block; }
.se3_box li	 b	{ display: block; font-size: 20px; margin: 30px 0 20px; }
.se3_box li	 span	{ display: block; font-size: 15px; line-height: 150%; }
.se3_box li:hover{ background-color: #333; -webkit-transition: 0.5s all ease; transition: 0.5s all ease; }
.se3_box li:hover b	{ color: #FFF; -webkit-transition: 0.5s all ease; transition: 0.5s all ease; }
.se3_box li:hover span{ color: #AAA; -webkit-transition: 0.5s all ease; transition: 0.5s all ease; }

.se4_box		{ overflow: hidden; }
.se4_box li		{ float: left; width: calc((100% - 60px) / 5); line-height: 20px; border: 1px #CCC solid; border-radius: 5px; padding: 30px 0; margin-left: calc(60px / 4); margin-bottom: 20px; text-align: center; box-sizing: border-box; font-size: 18px; }
.se4_box li:hover{ border: 2px #3E3B72 solid; color: #3E3B72; box-sizing: border-box; line-height: 18px; }

.se4_box li:nth-child(5n+1)	{ margin-left: 0; }
.se4_box li	 b	{ padding-right: 10px; }

.se5_box		{ overflow: hidden; }
.se5_box li		{ float: left; width: calc((100% - 80px) / 3); border: 1px #EEE solid; color: #333; border-radius: 5px; margin-left: calc(80px / 2); padding-left: 30px; background: linear-gradient(#FFF, #DDD); }
.se5_box li:nth-child(3n+1)	{ margin-left: 0; }
.se5_box li	 b	{ display: block; font-size: 20px; margin: 30px 0 20px; text-transform : uppercase; }
.se5_box li	 span	{ display: block; font-size: 15px; line-height: 150%; padding-top: 4px; margin:0 100px}
.se5_box i		{ font-weight: 700; font-style: normal; color: #3E3B72 }
.se5_box img	{ width:20%; float:left}
.se5_box .se5_subbox {padding-bottom:30px;}
.ft_box		{ overflow: hidden; }
.ft_box li		{ float: left; padding-right: 20px; line-height: 150%; }
.ft_box li:last-child	{ color: #999; float: none; clear: both; font-size: 0.9em; }

@media all and (max-width:1600px) {

.wrap_100	{ width: 100%; padding: 0 calc((100% - 1280px) / 2); }
.wrap_box		{ width: 100%; max-width: 1280px; margin: 0 auto; }

}

@media all and (max-width:1400px) {

.wrap_100	{ width: 100%; padding: 0 calc((100% - 1100px) / 2); }
.wrap_box		{ width: 100%; max-width: 1100px; margin: 0 auto; }

}

@media all and (max-width:1280px) {

.wrap_100	{ width: 100%; padding: 0 calc((100% - 800px) / 2); }
.wrap_box		{ width: 100%; max-width: 800px; margin: 0 auto; }

h1			{ font-size: 16px; padding: 80px 0 25px; }
h2			{ font-size: 33px; padding: 0 0 40px; line-height: 40px; }

header		{ height: 750px; background: #000 url(../image/header_bg.jpg) no-repeat 50% 50%; }
#section2		{ background-size: 1500px; }

.hder_logo	{ left: 40px; top: 45px; position: absolute; width: 120px; }

.hder_menu	{ padding-bottom: 250px; }
.hder_menu li	{ font-size: 15px; color: #FFF; font-weight: 800; float: left; margin: 0 10px; }
.hder_txt1		{ font-size: 25px; }
.hder_txt2		{ margin-bottom: 100px; font-size: 40px; }
.hder_txt3		{ font-size: 16px; }

.se1_box		{ padding: 50px 0; }
.se1_box li	 b	{ font-size: 16px; }
.se1_box li	 span	{ font-size: 13px; }

.se2_box1 li	{ font-size: 13px; margin-right: 5px; }
.se2_box2 li	{ height: 300px; }
.se2_box2 li:hover b	{ padding-top: 130px; }

.se3_box li	 img	{ width: 60px; height: 60px; }
.se3_box li	 b	{ font-size: 16px; }
.se3_box li	 span	{ font-size: 13px; }

.se4_box li		{ font-size: 13px; padding: 20px 0; }

.se5_box li		{ padding-left: 20px; }
.se5_box li	 b	{ font-size: 16px; margin: 20px 0 10px; }
.se5_box li	 span	{ font-size: 13px; }

.ft_box		{ font-size: 13px; }

}

@media all and (max-width:920px) {

.wrap_100	{ width: 100%; padding: 0 calc((100% - 500px) / 2); }
.wrap_box		{ width: 100%; max-width: 500px; margin: 0 auto; }

.no_pc		{ display: block; }

h1			{ text-align: center; }
h2			{ text-align: center; font-size: 25px; }

header		{ height: 600px; }
#section2		{ background-size: 1000px; }

.hder_logo	{ left: 0; top: 30px; position: absolute; width: 100%; text-align: center; }
.hder_logo img	{ width: 150px;  }
.hder_menu	{ padding: 100px 0 120px; }
.hder_txt1		{ font-size: 18px; text-align: center; line-height: 130%; }
.hder_txt2		{ margin-bottom: 50px; font-size: 30px; text-align: center; }
.hder_txt3		{ font-size: 16px; text-align: center; }

.se1_box		{ padding: 10px 10%; }
.se1_box li		{ float: left; width: calc(100% / 1); border-left: 0; text-align: center; color: #333; border-top: 1px #EEE solid; padding: 40px 0; }
.se1_box li:first-child	{ border-top: 0; }

.se2_box1		{ width: fit-content; margin: 0 auto 30px; }
.se2_box2 li	{ height: 200px; }

.se3_box li		{ float: left; width: calc((100% - 20px) / 2); border: 1px #EEE solid; background: #FAFAFA; text-align: center; color: #333; border-radius: 5px; padding: 50px 0; margin-left: calc(20px / 1); margin-bottom: 20px; }
.se3_box li:nth-child(2n+1)	{ margin-left: 0; }

.se4_box li		{ float: none; width: 100%; margin-left: 0; }

.se5_box li		{ float: none; width: 100%; margin-left: 0; margin-bottom: 10px; }
.se5_box li	 br	{ display: none; }
.se5_box li	 .no_mo	{ display: block; }

}

@media all and (max-width:640px) {

.wrap_100	{ width: 100%; padding: 0 5%; }
.wrap_box		{ width: 90%; max-width: 90%; margin: 0 auto; }

h2			{ text-align: center; font-size: 22px; line-height: 150%; }

.hder_menu li	{ float: left; width: 50%; text-align: center; padding-bottom: 10px; margin: 0;}
.se5_box img {width: 15%}
}
