@charset "utf-8";

/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////
	
	Basic	

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
html,body{height:100%;}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, fieldset, button{margin:0; padding:0;}
body, h1, h2, h3, h4, h5, h6, th, td, input, select, textarea {margin:0; padding:0; line-height:21px; font-size:15px; color:#222;}
ul, ol, dl, dt, dd{margin:0; padding:0; list-style:none;}
img{border:none;}
hr{display:none;}
fieldset{border:none;}
legend{display:none;}
p{margin:0;}
table{table-layout:fixed; border-collapse:collapse; border-spacing:0;}
table caption{overflow:hidden; position:relative; line-height:1px; font-size:1px; text-indent:-30000px;}
.hidden{overflow:hidden; position:absolute; line-height:1px; font-size:1px; text-indent:-30000px;}

@media screen and (max-width:640px){
	body, h1, h2, h3, h4, h5, h6, th, td, input, select, textarea{line-height:19px; font-size:14px;}
}

label, input, button, a, span {line-height:1;}

/* 초기 한글사용(한글 및 중국, 일본 사이트용) */
input[type="text"],
input[type="password"],
textarea{ime-mode:active;}

*{
	-webkit-text-size-adjust:none;
	text-size-adjust:none;
	word-wrap: break-word;
	word-break: keep-all;
}


/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////
	
	Button
	
/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
a.btn{display:inline-block; min-width:170px; height:46px; line-height:46px; padding:0 10px; font-size:15px; text-align:center; transition:all 0.3s ease; -webkit-transition:all 0.3s ease;}
a.btn,
a.btn:link,
a.btn:visited,
a.btn:active{background:#ff8429; border:1px solid #ff8429; color:#fff;}
a.btn:hover{background:#fff; border:1px solid #ff8429; color:#ff8429; text-decoration:none;}

/* custom style */
a.btn.bg_01:link,
a.btn.bg_01:visited,
a.btn.bg_01:active{background:#5fb351; border:1px solid #5fb351;}
a.btn.bg_01:link:hover,
a.btn.bg_01:visited:hover,
a.btn.bg_01:active:hover{background:#fff; border:1px solid #5fb351; color:#5fb351;}

a.btn.bg_02:link,
a.btn.bg_02:visited,
a.btn.bg_02:active{background:#777; border:1px solid #777;}
a.btn.bg_02:link:hover,
a.btn.bg_02:visited:hover,
a.btn.bg_02:active:hover{background:#fff; border:1px solid #777; color:#777;}

a.btn.down{min-width:170px; padding:0 15px;}
a.btn.down:before{content:""; display: inline-block; width:18px; height:17px; margin-right:10px; margin-top:-4px; background-image: url(../../../images/site/skin/down.png); background-repeat:no-repeat; background-size:100%; vertical-align:middle;}
a.btn.down:hover:before{background-image:url(../../../images/site/skin/down1.png);}
a.down.bg_01:hover:before{background-image:url(../../../images/site/skin/down2.png);}

a.btn.small{position:relative; min-width:101px; height:37px; line-height:38px; padding:0 10px; font-size:15px;}
a.btn.small.down{min-width:101px; height:37px; line-height:36px; padding:0 15px; font-size:15px;}
a.btn.small.down:before{width:16px; height:15px; margin-right:7px;}
a.btn.down:hover,
a.btn.down.small:hover{background:#fff; border:1px solid #ff8429; color:#ff8429;}

.btn.down:link,
.btn.down:visited,
.btn.down:active,
.btn.down.small:link,
.btn.down.small:visited,
.btn.down.small:active{background:#ff8429; background-image:none; border:1px solid #ff8429; text-decoration:none; color:#fff;}

a.btn.arrow{min-width:121px; height:39px; line-height:39px; padding:0 15px;}
a.btn.arrow:after{content:""; display: inline-block; width:5px; height:9px; margin-top:-2.5px; margin-left:10px; background-image: url(../../../images/site/skin/arrow.png); background-repeat:no-repeat; vertical-align:middle;}
a.btn.arrow:hover:after{background-image: url(../../../images/site/skin/arrow1.png);}
a.btn.arrow.bg_05:hover:after{background-image: url(../../../images/site/skin/arrow2.png);}
a.btn.arrow.bg_01:hover:after{background-image: url(../../../images/site/skin/arrow3.png);}

@media screen and (max-width:840px){
	a.btn{min-width:120px;}
	a.btn.down{min-width:93px;}
	a.btn.down:before{width:16px; height:15px; margin-right:7px;}
	a.btn.small,
	a.btn.small.down{min-width:45px; height:32px; line-height:34px; font-size:13px;}
	a.btn.small.down{padding:0 10px;}
	a.btn.small.down:before{width:14px; height:13px;}
}
@media screen and (max-width:480px){
	a.btn{min-width:90px;}
	a.btn.down{min-width:60px;}
	a.btn.down:before{width:15px; height:16px; margin-top:-1px;}
	a.btn.small,
	a.btn.small.down{min-width:55px; height:28px; line-height:30px; font-size:13px;}
	a.btn.small.down:before{display: none;}
}

/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////
	
	js_slide Tag
	
/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.js_slide{position:relative; width:100%; height:80px; padding:10px 10px 10px 130px; box-sizing:border-box;}
.js_slide .title{display:block; position:absolute; left:0; top:12px; z-index:1; width:120px; font-size:18px; text-align:center;}
.js_slide .control{position:absolute; left:0; right:auto; top:auto; bottom:0px; z-index:1; width:120px; padding:0; text-align:center;}
.js_slide .control .count{display:none;}
.js_slide .control a[class*="btn_"]{overflow:hidden; display:inline-block; width:31px; height:31px; text-indent:-1000px; border:1px solid #c5c5c5; background:#fff;}
.js_slide .control a.btn_left{background-position:0 0;}
.js_slide .control a.btn_play{display:none; background-position:0 -93px;}
.js_slide .control a.btn_stop{background-position:0 -62px;}
.js_slide .control a.btn_right{background-position:0 -31px;}
.js_slide .control ul{display:none;}
.js_slide .move{overflow:hidden; position:relative; z-index:0; width:100%; height:100%;}
.js_slide .move ul{overflow:hidden; position:absolute; left:0; top:0; width:200000px; height:100%;}
.js_slide .move ul li{float:left; width:170px; height:100%; padding:0px 5px;}
.js_slide .move ul li a{overflow:hidden; display:block; position:relative; height:100%; text-align:center; border:1px solid #c5c5c5; background-color:#f8f8f8; box-sizing:border-box;
transition:all 0.3s ease; -webkit-transition:all 0.3s ease;}
.js_slide .move ul li a:hover,
.js_slide .move ul li a:focus{border:1px solid #ff6600;}
.js_slide .move ul li a span{display:block; position:absolute; left:50%; top:0; width:2000px; height:100%; margin-left:-1000px; text-align:center;}
.js_slide .move ul li img{display:block; margin:0 auto; height:100%;}

.js_slide.type_02{width:400px; height:250px; padding:0;}
.js_slide.type_02 .title{left:10px;}
.js_slide.type_02 .control{left:auto; right:10px; top:5px; width:100%; height:31px; background:#fff;}
.js_slide.type_02 .control .count{display:inline-block; letter-spacing:2px; vertical-align:middle;}
.js_slide.type_02 .control .count span{font-weight:700;}
.js_slide.type_02 .control a[class*="btn_"]{border:none; vertical-align:middle;}
.js_slide.type_02 .move{position:absolute; left:0; top:0; height:100%;}
.js_slide.type_02 .move ul{width:100%;}
.js_slide.type_02 .move ul li{float:none; position:absolute; left:100%; top:0; width:100%; padding:0;}
.js_slide.type_02 .move ul li:first-child{left:0;}
.js_slide.type_02 .move ul li a{overflow:hidden;}
.js_slide.type_02 .move ul li a:hover{border:none;}
.js_slide.type_02 .move ul li a:focus{border:1px solid #ff6600;}

.js_slide.type_03{width:100%; height:500px; padding:0;}
.js_slide.type_03 .title{
	left:10%; top:20%; width:auto; font-size:40px; text-align:left; color:#fff;
	text-shadow:1px 1px 2px #000;
	-moz-text-shadow:1px 1px 2px #000;
    -webkit-text-shadow:1px 1px 2px #000;
    -ms-text-shadow:1px 1px 2px #000;
    -khtml-text-shadow:1px 1px 2px #000;
    -o-text-shadow:1px 1px 2px #000;
}
.js_slide.type_03 .title span{display:block; line-height:22px; margin-top:10px; font-weight:400; font-size:16px;}
.js_slide.type_03 .control{left:0; bottom:auto; top:0; width:100%; height:100%;}
.js_slide.type_03 .control a[class*="btn_"]{position:absolute;}
.js_slide.type_03 .control a.btn_left,
.js_slide.type_03 .control a.btn_right{z-index:9; width:100px; height:100%; border:none; background:none;}
.js_slide.type_03 .control a.btn_play,
.js_slide.type_03 .control a.btn_stop{right:20px; bottom:20px; z-index:10; background:#fff;}
.js_slide.type_03 .control a.btn_left{left:0; top:0;}
.js_slide.type_03 .control a.btn_right{right:0; top:0;}
.js_slide.type_03 .control a.btn_left span,
.js_slide.type_03 .control a.btn_right span{display:block; position:absolute; left:0; top:50%; width:100px; height:100px; margin-top:-50px;}
.js_slide.type_03 .control a.btn_play span,
.js_slide.type_03 .control a.btn_stop span{display:block; width:100%; height:100%;}
.js_slide.type_03 .control a.btn_left span{background:url() no-repeat center 0px;}
.js_slide.type_03 .control a.btn_play{background-position:0 -93px;}
.js_slide.type_03 .control a.btn_stop{display:none; background-position:0 -62px;}
.js_slide.type_03 .control a.btn_right span{background:url() no-repeat center 0px;}
.js_slide.type_03 .control ul{display:block; position:absolute; left:0; bottom:20px; z-index:9; width:100%; text-align:left;}
.js_slide.type_03 .control ul li{display:inline-block; margin-right:4px;}
.js_slide.type_03 .control ul li:first-child{margin-left:20px;}
.js_slide.type_03 .control ul li a{
	overflow:hidden; display:block; width:20px; height:20px; text-indent:-10000px; background-color:#c5c5c5;
	border-radius:10px;
    -webkit-border-radius:10px;
	transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
	
}
.js_slide.type_03 .control ul li a.on{width:50px;}
.js_slide.type_03 .move{position:absolute; left:0; top:0; height:100%;}
.js_slide.type_03 .move ul{width:100%;}
.js_slide.type_03 .move ul li{float:none; position:absolute; left:100%; top:0; width:100%; padding:0;}
.js_slide.type_03 .move ul li:first-child{left:0;}
.js_slide.type_03 .move ul li a{overflow:hidden; cursor:default;}
.js_slide.type_03 .move ul li a:hover,
.js_slide.type_03 .move ul li a:focus{border:none;}

@media screen and (max-width: 800px){
	.js_slide.type_03{height:500px;}
}
@media screen and (max-width: 600px){
	.js_slide.type_03{height:300px;}
	.js_slide.type_03 .title{left:0; top:15%; width:100%; padding:0px 10px; font-size:23px; text-align:center; box-sizing:border-box;}
	.js_slide.type_03 .title span{font-size:12px;}
	.js_slide.type_03 .control a.btn_left,
	.js_slide.type_03 .control a.btn_right{display:none;}
}

div[class*="slide_view_"]{position:relative; width:100%; height:auto; padding:0px; margin-bottom:10px; text-align:center; background-color:#f8f8f8;}
div[class*="slide_view_"] span{display:none; overflow:hidden; position:absolute; left:0; bottom:0; width:100%; height:42px; padding:6px 5px; line-height:30px; background-color:#fff; text-overflow:ellipsis; white-space:nowrap; font-size:15px; text-align:center; color:#505050; box-sizing:border-box;}
div[class*="slide_view_"] span strong{display:inline-block; font-weight:700; font-size:15px;}
div[class*="slide_view_"] img{display:block; max-width:100%; margin:0 auto;}
div[class*="slide_view_"].notitle{padding-bottom:0;}
div[class*="slide_view_"].notitle span{display:none;}
.js_slide.type_04{height:80px; padding:0px 50px;}
.js_slide.type_04 .title{display:none;}
.js_slide.type_04 .control{bottom:0; z-index:0; width:100%; height:100%;}
.js_slide.type_04 .control a.btn_play,
.js_slide.type_04 .control a.btn_stop{display:none;}
.js_slide.type_04 .control a.btn_left,
.js_slide.type_04 .control a.btn_right{display:block; position:absolute; top:0; width:40px; height:100%; border:none; background:none;}
.js_slide.type_04 .control a.btn_left{left:0;}
.js_slide.type_04 .control a.btn_right{right:0;}
.js_slide.type_04 .control a.btn_left span,
.js_slide.type_04 .control a.btn_right span{
	display:block; position:absolute; left:0; top:0; width:100%; height:100%; background-size:auto 50% !important;
	transition:all 0.5s ease;
	-webkit-transition:all 0.5s ease;
}
.js_slide.type_04 .control a.btn_left span{background:url(../../../images/site/skin/photo_slide_left.gif) no-repeat center center;}
.js_slide.type_04 .control a.btn_right span{background:url(../../../images/site/skin/photo_slide_right.gif) no-repeat center center;}
.js_slide.type_04 .control a.btn_left:hover span{background:#b6b6b6 url(../../../images/site/skin/photo_slide_left_on.gif) no-repeat center center;}
.js_slide.type_04 .control a.btn_right:hover span{background:#b6b6b6 url(../../../images/site/skin/photo_slide_right_on.gif) no-repeat center center;}
.js_slide.type_04 .move ul li a:hover,
.js_slide.type_04 .move ul li a:focus,
.js_slide.type_04 .move ul li a.on:link,
.js_slide.type_04 .move ul li a.on:visited,
.js_slide.type_04 .move ul li a.on:active,
.js_slide.type_04 .move ul li a.on:hover{border:2px solid #ff6600;}



/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////
	
	Heading

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
p{margin:0;}
h2, h3, h4, h5, h6 {font-family:'Roboto','Titillium Web'; font-weight:500;}
h4, .h4{padding-left:0; font-size:24px; line-height:28px; color:#222; margin:40px 0 17px 0;}
h4 span, .h4 span {font-size:16px; line-height:20px; font-weight:400; margin:25px 0px 10px 0px;}
h5, .h5{padding-top:0; font-size:17px; line-height:22px; color:#222;}
h6, .h6{font-size:17px; color:#36344a;}

@media screen and (max-width:840px){
    /*Heading*/
    h4, .h4{font-size:22px; line-height:26px; margin:35px 0 14px 0;}
    h5, .h5{font-size:18px; line-height:22px; margin:20px 0px 7px 0px;}
    h6, .h6{font-size:16px;}
    
}
@media screen and (max-width:640px){
    /*Heading*/
    h4, .h4{font-size:20px; line-height:24px; margin:33px 0 12px 0;}
    h5, .h5{font-size:17px; line-height:21px; margin:15px 0px 5px 0px;} 
    h6, .h6{font-size:15px;}
}
@media screen and (max-width:480px){
    /*Heading*/
    h4, .h4{font-size:19px; line-height:23px; margin:30px 0 10px 0;}
	h5, .h5{font-size:16px;}
}





/*** Animation ***/
.section,
.section .ani,
.layout,
.section h3,
.section p.tit_p,
#section0 .slogon,
#section0 .slogon p,
#section0 .slogon p.title,
#section0 .slogon p.title:before,
#section0 .slogon p.title span{transition : all 0.3s ease; -webkit-transition : all 0.3s ease;}

.section {overflow:hidden; box-sizing: border-box;}
.fp-auto-height {overflow:visible;}
.section .layout{width: 100%; margin: 0 auto; max-width: 1260px; font-family: "Roboto";}
#section0.section,#section6.section{padding-top: 0; padding-bottom: 0;}
.section h3{position: relative; margin: 0; text-align: center; font-size: 55px; line-height: 59px; margin-bottom: 10px; font-weight:700; color: #222; letter-spacing: -0.6px; font-family: "Titillium Web";}
.section h3:before{content: ""; position: absolute; display: block; width: 43px; height: 34px; left: 50%; top: -45px; margin-left: -21.5px; background: url(../images/main/h3_title_fff.png) no-repeat center center; background-size: contain;}
#section1 .layout h3:before,#section3 .layout h3:before{background: url(../images/main/h3_title_3c7.png) no-repeat center center;}
#section3 .layout h3:before{display: none;}
.section p.tit_p{text-align: center; color:#222; font-size: 19px; line-height: 28px;}
.section .fp-tableCell {vertical-align: middle; box-sizing: border-box;}
.fp-viewing-0 #header, .fp-viewing-2 #header{background: transparent}
.fp-viewing-0 #header.active, .fp-viewing-2 #header.active{background: #fff;}
.fp-viewing-0 #header #gnb ul li a,.fp-viewing-2 #header #gnb ul li a{color: #fff;}
#header.ty2 #gnb >ul >li >a{color: #222;}
.fp-viewing-0 #header h1.logo a:after,.fp-viewing-2 #header h1.logo a:after{background-image:url(../images/layout/head_logo_fff.png)}
.fp-viewing-1 #header .toputil_control a.lang_kor,.fp-viewing-3 #header .toputil_control a.lang_kor,.fp-viewing-3 #header .toputil_control a.lang_kor{color:#222;}
.fp-viewing-0 #header .toputil_control .button,.fp-viewing-2 #header .toputil_control .button{background-image:url(../images/layout/main_search_fff.png); text-indent:-9999px;}
.fp-viewing-0 #header .toputil_control .button.on,.fp-viewing-2 #header .toputil_control .button.on{background-image:url(../images/layout/search_close_fff.png);}
.fp-viewing-0 #header .toputil_control a.allmenu_btn_open,.fp-viewing-2 #header .toputil_control a.allmenu_btn_open{background-image:url(../images/layout/main_allmenu_fff.png); text-indent:-9999px;}
.fp-viewing-0 #header #gnb,.fp-viewing-2 #header #gnb {border-bottom: 1px solid rgba(255,255,255,0.5);}

.section .ani {box-sizing:border-box; opacity:0; -webkit-opacity:0; position:relative; top:70px; z-index:10;}
.section .ani.on {opacity:1; -webkit-opacity:1; top:0;}	

#header .toputil_control a.allmenu_btn_open { display:none }


#fp-nav {margin-right:1.5% !important;}
#fp-nav ul li {width:9px !important; height:9px !important; margin:33px 0 0 0 !important;}
#fp-nav ul li:first-child {margin-top:0 !important;}
#fp-nav ul li:last-child {display:none !important;}
#fp-nav ul li a{position: relative; width:20px !important; height:20px !important; left:0 !important; top:0 !important; margin:0 !important;}	
#fp-nav ul li a:before{content: ""; display: block; position: absolute; width: 6px; height: 6px; background: #fff; border-radius: 50%;top:50%; left: 50%; margin-left: -3px; margin-top: -3px;}
.fp-viewing-1 #fp-nav ul li  a.active:before,.fp-viewing-3 #fp-nav ul li a.active:before{background:#555 !important;}
#fp-nav ul li a.active span{display: block; text-indent: -9999px; width: 22px !important; height: 22px !important; margin: -11px 0 0 -11px !important; background-color: transparent; border: 1px solid #fff; box-sizing: border-box;}
.fp-viewing-1 #fp-nav ul li a.active span,.fp-viewing-3 #fp-nav ul li a.active span{border: 1px solid #555;}
#fp-nav ul li a:after {display: block; width: 135px; font-size: 22px; line-height: 13px; position: absolute; right: 30px; top: -2px; color: #fff; text-align: right; opacity: 0.7; letter-spacing: -0.63px;}
#fp-nav ul li:hover a:after {color:#fff;}
#fp-nav ul li a.active:after{color:#fff;font-size: 30px;font-weight: 700;line-height: 46px;letter-spacing: -0.6px; top: -20px; opacity: 1;letter-spacing: -0.9px;}
#fp-nav.on ul li a.active:after,
#fp-nav.on ul li:hover a:after {color:#222;}
#fp-nav.on ul li a:before{background:#cecece !important;}
#fp-nav ul li a span, .fp-slidesNav ul li a span{display: none;}


#section0 {position: relative; background:rgba(15, 47, 112, 0.9);}
#section0 .fp-tableCell{box-sizing:border-box; padding-top:0; vertical-align: middle;}
#section0 .slider {position:absolute; width:100%; height:100%; left:0; top:0; overflow:hidden;}
#section0 .slider .control {position:absolute; width:100%; height:auto; z-index:100; left:0; bottom:70px; z-index:100; text-align: center}
#section0 .slider .control ul{display: inline-block;}
#section0 .slider .control ul li{float: left; display: inline-block; width: 13px; height: 13px; margin-left: 16px;  border-radius: 50%; border: 3px solid #fff; box-sizing: border-box;}
#section0 .slider .control ul li:first-child{margin-left: 0;}
#section0 .slider .control ul li a{display: inline-block; width: 100%; height: 100%; text-indent: -9999px; line-height: inherit;}
#section0 .slider .control ul li a.on{background: #fff;}
#section0 .slider .control a[class*="btn_"] span {line-height:1px; font-size:1px; position:absolute; left:-10000px; top:0; overflow:hidden; text-indent:-30000px;}
#section0 .slider .control a.btn_left,#section0 .slider .control a.btn_right {display: none;}
#section0 .slider .control a.btn_stop,
#section0 .slider .control a.btn_play{display: block; width: 16px; height: 12px; margin-left: 13px; z-index:10; text-indent: -999px; background-size: contain; }
#section0 .slider .control a.btn_stop {background:url(../images/main/btn_stop.png) no-repeat center center;}
#section0 .slider .control a.btn_play {background:url(../images/main/btn_play.png) no-repeat center center; display:none;}
#section0 .slider .control .count{display:none; position:absolute; right:50%; top:2px; margin-right:-600px; color:#bbb; font-size:16px; line-height:25px;}
#section0 .slider .control .count span {font-weight:500; font-size:25px; line-height:20px; color:#fff; position:relative; padding-right:10px; margin-right:10px; display:inline-block; vertical-align:top; }
#section0 .slider .control .count span:after {content:"/"; display:block;position:absolute; right:0; top:7px;}
#section0 .slider .move {position:absolute; left:0; top:0; width:100%; height:100%; overflow:hidden; z-index:5; transform:scale(1.3); -webkit-transform:scale(1.3); }
#section0 .slider .move.on {transform:scale(1); -webkit-transform:scale(1); opacity:1; -webkit-opacity:1;}
#section0 .slider .move ul {overflow:hidden; position:absolute; left:0; top:0; width:100%; height:100%;}
#section0 .slider .move ul li {position:absolute; left:0; top:0; width:100%; height:100%;}
#section0 .slider .move ul li >span {display:block; position:absolute; left:0; top:0; width:100%; height:100%; background-position:center top; background-size:cover; background-repeat:no-repeat;
transform:scale(1.3); -webkit-transform:scale(1.3); opacity:0; -webkit-opacity:0; transition : all 1.4s ease-out; -webkit-transition : all 1.4s ease-out;}
#section0 .slider .move ul li:first-child > span.lazy{background-image: url(../images/main/visual01_new.jpg);}
#section0 .slider .move ul li > span.lazy{background-image: url(../images/main/visual01_new.jpg);}
#section0 .slider .move ul li:last-child > span.lazy{background-image: url(../images/main/visual01_new.jpg);}
#section0 .slider .move ul li span.slogon{position:absolute; z-index:50; height: auto; width: 100%; top: calc(35% - 20px); padding: 0 10px; box-sizing: border-box; transform: scale(1); -webkit-transform: scale(1); transition: all 1s ease-out; opacity: 0; }
#section0 .slogon span.title {position: relative; display: block; text-align:center;}
#section0 .slogon span.title img {width:100%; height:auto;}

/*#section0 .slogon span.title {display: block; font-size:48px; line-height:65px; color:#fff; text-align:center;position: relative;}
#section0 .slogon span.title:before{content: ""; display: block; position: absolute; background: url(../images/main/main_title_fff.png) no-repeat center center ;width: 18px; height: 25px; top: -40px; left: 50%; margin-left: -12px;}*/
#section0 .slogon span.title strong{font-family: "Titillium Web";letter-spacing: -0.96px; font-weight: 600; }
#section0 .slogon span.title strong br{display: none;}
#section0 .slogon span.title span{display: block; font-size:17px; line-height:20px; vertical-align:top; letter-spacing: -0.34px; font-weight: 300; font-family: "Roboto";}
#section0 .slogon span.title br{display: none;}
#section0 .slider .move ul li.on {z-index:5;}
#section0 .slider .move ul li.on span {transform:scale(1); -webkit-transform:scale(1); opacity:1; -webkit-opacity:1;}


#section1 {background:#f3f3f3;}
#section1:before,
#section1:after {content:""; display:block; position:absolute; z-index:1;}
#section1:before {width:676px; height:395px; background:url(../images/main/sec01_bg.png) no-repeat right top; right: 0; top:0; background-size: contain;}
#section1:after {width:367px; height:321px;  background:url(../images/main/sec01_bg02.png) no-repeat left bottom; left: 0; bottom:0; background-size: contain;}
#section1 .layout > p{ margin-bottom: 67px;}
#section1 .layout > div{width: 100%; font-family: "Roboto";}
#section1 .layout > div > div{width: 49.5%; float: left; margin-left: 1%; height: 445px;}
#section1 .layout > div > div:first-child{margin-left: 0;}
#section1 .layout > div > div:first-child > a{position: relative; display: block; padding: 60px 55px; box-sizing: border-box; background: #192a56 url(../images/main/sec01_ceo_202306.jpg) no-repeat bottom right 50%; height: 445px; text-decoration: none;}
#section1 .layout > div > div:first-child > a h4{position: relative; font-size: 38px; line-height: 50px; margin-bottom: 45px; color: #fff;}
#section1 .layout > div > div:first-child > a h4:after{content: ""; display: block; position: absolute; height: 1px; width: 34px; bottom: -20px; left: 0; background: rgba(255,255,255,0.6); }
#section1 .layout > div > div:first-child > a p{color: #fff;}
#section1 .layout > div > div:first-child > a span.btn{position: absolute; display: inline-block; padding: 0 40px; left: 55px; bottom: 65px; border: 1px solid #fff; color: #fff; line-height: 42px; box-sizing: border-box; font-size: 16px; letter-spacing: -0.48px;transition: all 0.3s ease;}
#section1 .layout > div > div:first-child > a:hover span.btn{ background: #fff; color: #192a56; }
#section1 .layout > div > div > div{width: 49%; height: 49%; margin-left: 2%; float: left; background: #fff;}
#section1 .layout > div > div > div:first-child{margin-left: 0;}
#section1 .layout > div > div > div:nth-child(3){margin-left: 0; margin-top: 2%;}
#section1 .layout > div > div > div:last-child{margin-top: 2%;}
#section1 .layout > div > div > div a{position: relative; display: block; width: 100%; height: 100%; padding: 30px; box-sizing: border-box; text-decoration: none;}
#section1 .layout > div > div > div a:before{content: ""; display: block; position: absolute; right: 30px; bottom: 20px; width: 66px; height: 75px; background-repeat: no-repeat; background-position: center center; background-image: url(../images/main/sec02_over.png);}
#section1 .layout > div > div > div a:hover:before{animation: tong 0.5s linear 0s infinite alternate;}
@keyframes tong {
	0% {bottom: 20px}
	100% {bottom: 30px;}
}
#section1 .layout > div > div > div:nth-child(2) a:before{background-image: url(../images/main/sec02_orga.png); right: 19px;}
#section1 .layout > div > div > div:nth-child(3) a:before{background-image: url(../images/main/sec02_repo.png);}
#section1 .layout > div > div > div:nth-child(4){position: relative; padding: 30px; box-sizing: border-box;}
#section1 .layout > div > div > div:nth-child(4):before{content: "";display: block;position: absolute;right: 0;bottom: 0;width: 142px;height: 146px;background-repeat: no-repeat;background-size: contain;background-position: bottom right;}
#section1 .layout > div > div > div.bangwul1:before{background-image:url(../images/main/bangwul1.png);}
#section1 .layout > div > div > div.bangwul2:before{background-image:url(../images/main/bangwul2.png);}
#section1 .layout > div > div > div.bangwul3:before{background-image:url(../images/main/bangwul7.png);}
#section1 .layout > div > div > div:nth-child(4) div{width: 110px;margin-top: 10px;transition: all 0.3s ease;-webkit-transition: all 0.3s ease;}
#section1 .layout > div > div > div:nth-child(4) div span{float: left; display: block; width: 50px; height: 50px; margin-left: 10px; background-repeat: no-repeat; background-size: contain; background-position: center center; text-indent: -9999px; cursor: pointer; border-radius: 50%; -webkit-border-radius: 50%; transition: all 0.3s ease; -webkit-transition: all 0.3s ease;}
#section1 .layout > div > div > div:nth-child(4) div span:first-child,#section1 .layout > div > div > div:nth-child(4) div span:nth-child(3){margin-left:0;}
#section1 .layout > div > div > div:nth-child(4) div span:nth-child(3),#section1 .layout > div > div > div:nth-child(4) div span:nth-child(4){margin-top:6px;}
#section1 .layout > div > div > div:nth-child(4) div span.yt{background-image:url(../images/main/sns_yt.png);}
#section1 .layout > div > div > div:nth-child(4) div span.fb{background-image:url(../images/main/sns_fb.png);}
#section1 .layout > div > div > div:nth-child(4) div span.tw{background-image:url(../images/main/sns_tw.png);}
#section1 .layout > div > div > div:nth-child(4) div span.in{background-image:url(../images/main/sns_in.png);}
#section1 .layout div h4{font-family: "Titillium Web"; margin:0; font-size: 35px; line-height: 42px; font-weight: 600; letter-spacing: -0.7px;}
#section1 .layout div p{margin-top: 15px; font-size: 17px; line-height: 23px; letter-spacing: -0.17px; font-weight: 300; color: #666;}


#section2{position: relative; background: url(../images/main/sec02_bg.jpg) no-repeat center center; overflow: hidden; background-size: cover; text-align: right;}
#section2:before{content: ""; display: block; clear: both;}
#section2 ul.top_ul{overflow: hidden; margin-top: 50px; }
#section2 ul.top_ul:after{content: ""; display: block; clear: both;}
#section2 h3{color: #fff;}
#section2 p.tit_p{color: #fff; font-weight: 300;}
#section2 .news_tab{margin-top:40px; font-family: "Roboto";}
#section2 .tab_btn{position: relative; width: 230px; height: 38px; border-radius: 30px; border: 2px solid #fff; display: inline-block; box-sizing: border-box; margin: 20px 0 ; }
#section2 .tab_btn a{position: absolute;top: -2px; right: -1px; float:left; width: 50%; height: 38px; margin-left: -10px; box-sizing: border-box; border-radius: 30px; text-align: center; min-width: 120px; color: #fff; font-family: "Titillium Web"; font-weight: 300; padding: 10.5px 0; font-size: 15px;}
#section2 .tab_btn a:first-child{margin-left: 0; right: auto; left: -1px;;}
#section2 .tab_btn a:hover{text-decoration: none;}
#section2 .tab_btn a.on{ background: #fff; color:#0a559b; font-weight: 700; font-size: 16px;}
#section2 .tab_cont {display:none; position:relative;}
#section2 .tab_cont.on {display:block;}
#section2 .tab_cont .news.list{position: relative; width: 100%; height: 420px; padding: 0;}
#section2 .tab_cont .news.list:after{content: ""; display: block; clear: both; }
#section2 .tab_cont#tab01 .news.list .control{display: none;}
#section2 .tab_cont .news.list .control{position: absolute; width: 100%; top: 50%;margin-top: -31.5px; }
#section2 .tab_cont .news.list .control a.btn_play, #section2 .tab_cont .news.list .control a.btn_stop{display: none !important;}
#section2 .tab_cont .news.list .control a.btn_right{position: absolute; right: -93px; display: block; width:33px; height:63px; background: url(../images/main/sec3_arrow.png) no-repeat center center; border: none;}
#section2 .tab_cont .news.list .control a.btn_left{position: absolute; left: -93px; display: block; width:33px; height:63px; background: url(../images/main/sec3_arrow.png) no-repeat center center; transform: rotate(180deg); border: none;}
#section2 .tab_cont .news.list .control a.btn_right span,#section2 .tab_cont .news.list .control a.btn_left span{display: block; text-indent: -9999px; text-align: left;}
#section2 .tab_cont .news.list .move{position: relative; z-index: 1; height: 100%;}
#section2 .tab_cont#tab02 .news.list .move{overflow: hidden;}
#section2 .tab_cont#tab01 .news.list .move{overflow: visible;}
#section2 .tab_cont .news.list .move ul{width: 100%; height: 100%; overflow: visible; box-sizing: border-box; }
#section2 .tab_cont#tab01 .news.list .move ul{border-top: 2px solid #fff; border-bottom: 2px solid #fff;}
#section2 .tab_cont .news.list .move ul li{position: relative; float: left; width: 25%; height: 100%; padding: 0; text-align: center;  box-sizing: border-box;}
#section2 .tab_cont#tab01 .news.list .move ul li{border-left: 1px solid #fff;}
#section2 .tab_cont#tab01 .news.list .move ul li:first-child{border-left: none;}
#section2 .tab_cont .news.list .move ul li span{position: static; margin-left: 0; width: auto; height: auto; }
#section2 .tab_cont .news.list .move ul li div {height: 100%;}
#section2 .tab_cont#tab01 .news.list .move ul li div a{background: transparent no-repeat center center; border: none; padding: 23% 10%; transition: all 0.3s ease;}
#section2 .tab_cont .news.list .move ul li div a{position: absolute; left: 0; width: 100%; height: 100%; background: transparent; border: none; box-sizing: border-box; overflow: hidden;}
#section2 .tab_cont#tab02 .news.list .move ul li div a{padding: 0 2.5%;}
#section2 .tab_cont .news.list .move ul li div a img{width: 100%; height: 100%;}
#section2 .tab_cont#tab01 .news.list .move ul li div:hover a,#section2 .tab_cont#tab01 .news.list .move ul li div:active a{width: calc(100% + 2px); margin-left: -1px; margin-top: -40px; z-index: 1; text-decoration: none; box-shadow: 0 0 15px #1d2550; transition: all 0.3s ease;}
#section2 .tab_cont .news.list .move ul li div a p.mv_tit{display: inline-block; background-color: #1a2a56; padding:0 42px; line-height: 42px; box-sizing: border-box; border-radius: 25px; color: #fff; font-size: 15px; border: 1px solid #1a2a56; transition: all 0.3s ease;}
#section2 .tab_cont .news.list .move ul li div:hover a p.mv_tit{background-color: transparent; border: 1px solid #fff;}
#section2 .tab_cont .news.list .move ul li div a h4{font-family: "Titillium Web";font-weight: 900;font-size: 28px;line-height: 34px;color: #fff;display: -webkit-box;height: 68px;word-break: break-word;-webkit-line-clamp: 2;-webkit-box-orient: vertical;text-overflow: ellipsis;overflow: hidden;}
#section2 .tab_cont .news.list .move ul li div a p.date{font-family: "Titillium Web"; font-size: 18px; color: #fff;}
#section2 .tab_cont .news.list .move ul li div a span{display: block; margin-top: 65px; color: #fff; text-decoration: underline;}
#section2 .tab_cont#tab01 .news.list .move ul li div a img{display: none; width: 636px; top: 0; left: 50%; margin-left: -318px; position: absolute; z-index: -1;}
#section2 .tab_cont#tab01 .news.list .move ul li div:hover a img{display: block; }
#section2 .tab_cont#tab01 .news.list .move ul li div a:after{content: ""; display: none; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color:rgba(3, 41, 116, 0.75); z-index: -1;}
#section2 .tab_cont#tab01 .news.list .move ul li div:hover a:after{display: block; }
#section2 .tab_cont#tab01 .news.list .move ul li.jour_box div a img{width:100%; height:100%; margin-left:0; left:0;}
#section2 .tab_cont .news.list .move ul li div a p.mv_tit{padding: 0; min-width: 130px;}
#section2 .tab_cont .news.list .move ul li.jour_box div a p.mv_tit{background-color:#fd9500; border-color:#fd9500;}


#section3{background:#f7f9fa; overflow: hidden;}
#section3 .maps{position: relative; font-family: "Roboto";}
#section3 .maps img{width: 100%;}
#section3 .maps > span{position: absolute; display: block; max-width: 18px; max-height: 18px; width: 4%; height: 4%; background-size: auto 100%; background-repeat: no-repeat; background-position: center center; transform: translate(-50%, -50%);}
#section3 .maps > span > span{display: none; position: absolute; min-width: 132px; width: 900%; height: 30px; top: -55px; left: 11px; color: #fff; line-height: 30px; text-align: center; font-weight: 300; text-indent: 0; background-repeat: no-repeat; opacity: 0; font-family: "Titillium Web";}
#section3 .maps > span > span.two{line-height: 19px; height: 55px; padding: 8px 0; box-sizing: border-box; top:-75px; }
#section3 .maps > span > span:after{content: ""; display: block; position: absolute; width: 18px; height: 17px; left: 0; bottom: -17px;; background-repeat: no-repeat; background-position: top left; background-size: contain; }
#section3 .maps > span.blu > span:after{background-image: url(../images/main/sec03_blu_after.svg);}
#section3 .maps > span.yel > span:after{background-image: url(../images/main/sec03_yel_after.svg);}
#section3 .maps > span.gra > span:after{background-image: url(../images/main/sec03_gra_after.svg);}
#section3 .maps > span.on > span{opacity: 1; display: block; z-index: 9;}
#section3 .maps > span.blu{background-image: url(../images/main/sec03_blu.svg);}
#section3 .maps > span.blu span{background-color: #446fb3;}
#section3 .maps > span.yel{background-image: url(../images/main/sec03_yel.svg);}
#section3 .maps > span.yel span{background-color: #ffab00;}
#section3 .maps > span.gra{background-image: url(../images/main/sec03_gra.svg);}
#section3 .maps > span.gra span{background-color: #707070;}
#section3 .maps > span.uzb{left: 23.5%; top: 33%;}
#section3 .maps > span.geo{left: 16%; top: 43.5%;}
#section3 .maps > span.pak{left: 24%; top: 51%;}
#section3 .maps > span.cam{left:33%; top: 55%;}
#section3 .maps > span.indi{left: 25.5%; top: 62%;}
#section3 .maps > span.phi{left:37.5%; top: 62.5%;}
#section3 .maps > span.ind{left:36%; top: 66%;}
#section3 .maps > span.uga{left: 14.3%; top: 68%;}
#section3 .maps > span.per{left:83%; top: 71.5%;}
#section3 .maps > span.sol{left:44.5%; top: 72.5%;}
#section3 .maps .data_total{position: absolute; bottom: 0; left: 0; font-family: "Titillium Web"; }
#section3 .maps .data_total p{position: absolute; display: inline-block; bottom: 0; left: 0; font-size: 20px; line-height: 25px; letter-spacing: -0.2px; font-weight: 600;}
#section3 .maps .data_total ul{position: relative; margin-left: 110px; padding: 5px 10px 5px 25px; box-sizing: border-box;}
#section3 .maps .data_total ul:before{content: ""; display: block; position: absolute; width: 2px; height: 40px; background: rgba(194, 194, 194, 0.5); left: 0; top: 50%; margin-top: -20px;}
#section3 .maps .data_total ul:after{content: ""; display: block; clear: both; }
#section3 .maps .data_total ul li{float: left; font-size: 15px; color: #666; margin-left: 15px; letter-spacing: -0.15px; }
#section3 .maps .data_total ul li:first-child{margin-left: 0;}
#section3 .maps .data_total ul li strong{margin-right: 5px; font-size: 50px; color: #356fc4; letter-spacing: -0.5px; vertical-align:sub;}
#section3 .maps .explan{position: absolute; padding: 12px 24px; box-sizing: border-box; right: 0; bottom: 0; background: rgba(255, 255, 255, 0.64); border-radius: 30px; box-shadow: 0 3px 6px 
rgba(0, 0, 0, 0.16);}
#section3 .maps .explan span{position: relative; display: inline-block; box-sizing: border-box; padding-left: 28px; margin-left: 10px; font-size: 15px; line-height: 18px; letter-spacing: -0.26px; font-weight: 300;}
#section3 .maps .explan span:first-child{margin-left: 0;}
#section3 .maps .explan span:before{content: ""; display: block; position: absolute; width: 15px; height: 21px; left: 5px; top: 50%; margin-top: -10.5px; background-repeat: no-repeat; background-position: center center; }
#section3 .maps .explan span.blu:before{background-image: url(../images/main/sec03_ex_blu.png);}
#section3 .maps .explan span.yel:before{background-image: url(../images/main/sec03_ex_yel.png);}
#section3 .maps .explan span.gra:before{background-image: url(../images/main/sec03_ex_gra.png);}
#section3 .txts{position: relative; width: 100%; margin-top: 20px; padding: 21.5px 0; box-sizing: border-box; background: url(../images/main/sec03_txtbg.png) no-repeat left top; background-size: cover; font-family: "Titillium Web";}
#section3 .txts p{position: absolute; top: 50%; left: 8%; margin-top: -28px; font-size: 38px; line-height: 50px; color: #fff; font-weight: 700;}
#section3 .txts ul{position: relative; width: 100%; padding-left: 30%; box-sizing: border-box;}
#section3 .txts ul:after{content: ""; display: block; clear: both; }
#section3 .txts ul li{position: relative; float: left; width: 33.3%; border-left: 2px dashed rgba(255, 255, 255, 0.7); box-sizing: border-box;}
#section3 .txts ul li:first-child{border-left: 0;}
#section3 .txts ul li a{display: block; width: 100%; padding: 6px 5%; box-sizing: border-box; font-size: 31px; line-height: 35px; letter-spacing: -0.62px; color: #fff; font-weight: 600; text-decoration: none;}
#section3 .txts ul li a em{font-family: "Titillium Web";}
#section3 .txts ul li a:after{content: ""; display: block; position: absolute; width: 65px; height: 68px; top: 50%; margin-top: -34px; right: 8%; background-image: url(../images/main/sec03_shar.png); background-repeat: no-repeat; background-position: center center;}
#section3 .txts ul li:first-child a:after{background-image: url(../images/main/sec03_safe.png);}
#section3 .txts ul li:last-child a:after{background-image: url(../images/main/sec03_fusi.png);}
#section3 .txts ul li a span{display: block; margin-top: 5px; font-size: 15px; line-height: 19px; font-weight: 300; letter-spacing: -0.3px; font-family: "Roboto"; color: rgba(255,255,255,0.7);}


#section4 .layout{margin-top: 0;}
#section4 .fp-tableCell {padding:0; top:0; opacity:1; -webkit-opacity:1;} 

@media screen and (min-width: 1025px){
    #section2 .tab_cont#tab01 .news.list .move ul li{width:25% !important;}
    #section2 .tab_cont#tab01 .news.list .move ul li:nth-child(1){left: 0 !important;}
    #section2 .tab_cont#tab01 .news.list .move ul li:nth-child(2){left: 25% !important;}
    #section2 .tab_cont#tab01 .news.list .move ul li:nth-child(3){left: 50% !important;}
    #section2 .tab_cont#tab01 .news.list .move ul li:nth-child(4){left: 75% !important;}
}

@media screen and (max-width: 1500px){
    #section1:before{width: 473px; height: 276px;}
    
    #section2 .tab_cont#tab02 .news.list .move{width: 85%; margin: 0 auto; }
    #section2 .tab_cont#tab02 .news.list .move ul{width: 1380px; box-sizing: border-box;}
    #section2 .tab_cont#tab02 .news.list .move li{width:304px; height: 462px;}
    #section2 .tab_cont .news.list .control a.btn_left{left: -0px;}
    #section2 .tab_cont .news.list .control a.btn_right{right: -0px;}
}

@media screen and (max-width: 1450px){
    #fp-nav.right {right:3% !important; margin-right: 0 !important;}	
}

@media screen and (max-width: 1440px) and (min-width:1025px){
    #section3 .layout{text-align: center;}
    #section3 .maps{width: 80%; margin: 0 auto; }
    #section3 .maps .explan{right: -10%;}
    #section3 .maps .data_total{left: -10%;}
    #section3 .txts ul li a{text-align: left;}
}

@media screen and (max-width: 1300px){
    .section .ani {padding:0 25px;}  
    
    #section0 .slider .move ul li >span{transition : opacity 1.4s ease-out; -webkit-transition : opacity 1.4s ease;}
    
    #section1 .layout > div > div > div:nth-child(4):before{width:128px; height:132px;}
    #section1 .layout div h4{font-size: 33px;}
    
    #section3 .txts ul{padding-left: 280px;}
    #section3 .txts p{left: 50px;}
    #section3 h3{margin-bottom: 0;}
}

@media screen and (max-width: 1150px){
	#section1 .layout > div > div > div:nth-child(4):before{width:99px; height:102px;}
}

@media screen and (max-width: 1024px){	
    body{overflow-x: hidden;}
    #fp-nav{display: nonenone !important;}
    .fp-section, .fp-tableCell {display:block !important; height:auto !important;}
    .section {padding-top: 115px; padding-bottom: 90px;}
    .section .ani{padding: 0 20px;}
    .section h3{font-size:42px; line-height:50px; margin-bottom: 35px;}
    .section h3:before{width: 24px; height: 35px; top: -40px; margin-left: -12px; background-size: contain;}
    .section p.tit_p {display: none;}
    .fp-tableCell {padding:0 0;}
    .section .ani{opacity:1 !important; -webkit-opacity: 1 !important; top:0 !important;}
    
    #section0{padding-top:85px !important; padding-bottom: 95px !important;}
    #section0 .fp-tableCell {padding:230px 0 250px 0;}
    #section0 .slider .move ul li span.slogon{top: 155px; margin-top: 0;}
    /*#section0 .slogon span.title {font-size:48px; line-height:47px; margin-bottom:0;}
    #section0 .slogon span.title span {font-size:17px; line-height:21px; padding:10px 0 0 ;}
    #section0 .slogon span.title:before{width: 19px; height: 27px; background-size: contain; top: -40px;}*/
    #section0 .slider .control {bottom:60px;}
    #section0 .slider .control ul li{width: 19px; height: 19px;}
    #section0 .slider .control .count span{font-size: 30px; font-weight: 600;}
    #section0 .slider .control .count span:after{font-size: 21px; left: 23px; top: 3px; font-weight: 100;}
    #section0 .slider .control a.btn_stop, #section0 .slider .control a.btn_play {width: 12px; height: 19px; margin-top:0; top: 3px; background-size: contain;}
    
    #section1:before{width: 259px; height: 165px;}
    #section1:after{width: 294px; height: 257px; bottom: -80px; left: -70px;}
    #section1 .layout > div > div{width: 100%; margin-left: 0; margin-top: 27px;}
    #section1 .layout > div > div:first-child{margin-top: 0;}
    #section1 .layout > div > div:last-child{height: auto;}
    #section1 .layout > div > div:first-child > a{background-position: bottom right;}
    #section1 .layout > div > div > div{height: 158px;}
    #section1 .layout > div > div > div a{padding: 25px;}
    #section1 .layout > div > div > div p{display: none;}
    #section1 .layout div h4{font-size: 32px; line-height: 39px;}
    #section1 .layout > div > div:first-child > a p{font-size: 20px; line-height: 30px;margin-top: 0; color: rgba(255,255,255,0.8);}
    #section1 .layout > div > div:first-child > a span.btn{color: rgba(255,255,255,0.8);}
    #section1 .layout > div > div > div a:hover:before{animation: none;}
    #section1 .layout > div > div:first-child > a:hover span.btn{background: transparent; color: rgba(255,255,255,0.8);}
	#section1 .layout > div > div > div:nth-child(4):before{width: 142px;height: 146px;}
	#section1 .layout > div > div > div:nth-child(4) div{display: inline-block; width: auto;}
	#section1 .layout > div > div > div:nth-child(4) div span{width: 45px; height: 45px;}
	#section1 .layout > div > div > div:nth-child(4) div span:nth-child(3){margin-left:10px;}
	#section1 .layout > div > div > div:nth-child(4) div span:nth-child(3),#section1 .layout > div > div > div:nth-child(4) div span:nth-child(4){margin-top:0;}
    
    
    #section2{text-align: center;}
    #section2 .ani{padding: 0;}
    #section2 h3{margin-bottom: 0;}
    #section2 .tab_btn{margin: 20px 0; width: 260px; height: 46px;}
    #section2 .tab_btn a{padding: 10px 5px; height: 46px; font-size: 18px; min-width: 140px; line-height: 25px;}
    #section2 .tab_btn a.on{font-size: 18px;}
    #section2 .tab_cont .news.list{height: 462px; margin-bottom: 30px;}
    #section2 .tab_cont#tab01 .news.list .control{display: block;}
    #section2 .tab_cont .news.list .control{width: 170px; top: auto; bottom: -30px; left: auto; right: 50%; margin-right: -85px; margin-top:0;}
    #section2 .tab_cont .news.list .control a.btn_left,#section2 .tab_cont .news.list .control a.btn_right{width: 81px; height: 19px;}
    #section2 .tab_cont .news.list .control a.btn_left{background: url(../images/main/sec3_arrow_t.png) no-repeat center center; transform: rotateY(180deg); -webkit-transform: rotateY(180deg); }
    #section2 .tab_cont .news.list .control a.btn_right{background: url(../images/main/sec3_arrow_t.png) no-repeat center center;}
    #section2 .tab_cont#tab01 .news.list .move{border: 2px solid #fff; border-left: none; border-right: none;}
    #section2 .tab_cont#tab02 .news.list .move{width: 100%; margin-left: 0;}
    #section2 .tab_cont .news.list .move ul{width: 992px;}
    #section2 .tab_cont#tab01 .news.list .move ul{border: none; }
    #section2 .tab_cont#tab02 .news.list .move ul{width: 100%;}
    #section2 .tab_cont#tab02 .news.list .move ul li{height:100%;}
    #section2 .tab_cont#tab01 .news.list .move ul li{width:304px;}
    #section2 .tab_cont#tab01 .news.list .move ul li:last-child{border-right: 1px solid #fff;}
    #section2 .tab_cont .news.list .move ul li div a:hover{margin-top: 0; background: none; box-shadow: none;}
    #section2 .tab_cont#tab01 .news.list .move ul li div:hover a, #section2 .tab_cont#tab01 .news.list .move ul li div:active a{margin-top: 0; box-shadow: none; width: 100%; margin-left: 0;}
    #section2 .tab_cont .news.list .control a.btn_left{left: 0; text-indent: -9999px;}
    #section2 .tab_cont .news.list .control a.btn_right{right: 0; text-indent: -9999px;}
    #section2 .tab_cont#tab01 .news.list .move ul li div a p.mv_tit{transition: background-color 0.3s linear; -webkit-transition: background-color 0.3s linear; border: none; padding: 0 38px; line-height: 38px; background-color: rgba(26, 42, 86, 0.6);}
    #section2 .tab_cont#tab01 .news.list .move ul li[data-cnt="0"] div a p.mv_tit{background-color:#ffab00;}
    #section2 .tab_cont .news.list .move ul li div a span{display: none;}
    #section2 .tab_cont#tab01 .news.list .move ul li div:hover a:after{display: none;}
    #section2 .tab_cont#tab01 .news.list .move ul li div a h4{height: 102px; -webkit-line-clamp:3; margin-bottom: 80px; color: rgba(255, 255, 255, 0.6); font-weight: 600;}
    #section2 .tab_cont#tab01 .news.list .move ul li[data-cnt="0"] div a h4{color: #fff;}
    #section2 .tab_cont#tab01 .news.list .move ul li[data-cnt="0"] div a p.date{color: #fff;}
    #section2 .tab_cont#tab01 .news.list .move ul li div a p.date{color: rgba(255, 255, 255, 0.6); font-size: 20px;}
    #section2 .tab_cont#tab01 .news.list .move ul li div:hover a img{display: none; }
    #section2 .news_tab{margin-top:30px;}
    #section2 .tab_cont#tab01 .news.list .move ul li.jour_box div a p.mv_tit{background-color:rgba(253, 149, 0, 0.6); border-color:rgba(253, 149, 0, 0.6); color:fff;}
    #section2 .tab_cont#tab01 .news.list .move ul li[data-cnt="0"] div a p.mv_tit{background-color:#fff; color:#0a559b; font-weight:500;}
    #section2 .tab_cont .news.list .move ul li div a p.mv_tit{padding:0; min-width:115px;}
    
    #section3 h3{margin-bottom: 35px;}
    #section3 .layout h3:before{display: block;}
    #section3 .maps{margin-bottom: 80px;}
    #section3 .maps .explan{bottom: -50px;}
    #section3 .maps .explan span{font-size: 14px;}
    #section3 .maps .data_total{bottom: -50px;}
    #section3 .txts{padding: 13px 0;}
    #section3 .txts ul{padding-left: 0;}
    #section3 .txts ul li a{font-size: 25px; line-height: 29px;}
    #section3 .txts ul li a:after{width: 60px; height: 63px; background-size: contain; margin-top: -31.5px;}
    #section3 .txts ul li a span{font-size: 14px;}
    #section3 .txts p{display: none;}
    #section3 .maps > span > span{width: 500%;}
    
    #section4{padding: 0;}

	#header .toputil_control a.allmenu_btn_open { display:block }
    
}
@media screen and (max-width: 840px){
	#section1 .layout > div > div > div:nth-child(4):before{width: 121px;height: 124px;}
	#section1 .layout > div > div > div:nth-child(4) div span{width:40px; height:40px; margin-left:8px;}
	#section1 .layout > div > div > div:nth-child(4) div span:nth-child(3){margin-left:8px;}
	
    #section3 .txts ul li a{padding: 5px 7%;}
    #section3 .txts ul li a:after{width: 52px; height: 54px; margin-top: -27px;}
    #section3 .maps{margin-bottom: 140px;}
    #section3 .maps .explan{right: 50%; margin-right: -177.5px;}
    #section3 .maps .data_total{bottom: -115px; left: 50%; margin-left: -265px;}
    #section3 .maps .data_total ul{margin-left: 250px;}
    #section3 .maps .data_total p{font-size: 28px; line-height: 45px;}
    #section3 .maps .data_total p br{display: none;}
    #section3 .maps .data_total ul li strong{font-size: 40px;}
}
@media screen and (max-width: 767px){
    #section0{padding-top: 142px !important;}
    #section0 .slider .move ul li span.slogon{top: 220px;}
    #section0 .slider .move ul li >span{background-position:center top 70px;transition : all 1.4s ease; -webkit-transition : all 1.4s ease-out;}
}
@media screen and (max-width: 740px){
	#section1 .layout > div > div > div:nth-child(4):before{width: 99px;height: 102px;}
	#section1 .layout > div > div > div:nth-child(4) div span{width:35px; height:35px; }
}
@media screen and (max-width: 640px){
    .section {padding-top: 90px; padding-bottom:65px; }
    .section .ani {padding:0 4%;}
    .section p.tit_p{display: none;}
    .section h3{font-size: 37px; line-height: 41px; margin-bottom: 30px;}
    .section h3:before, #section2 .layout h3:before{top: -30px; width: 18px; height: 26px; background-size: contain;}
    #section1 .layout h3:before, #section3 .layout h3:before{background-size: contain;}
    
    #section0 {padding-top: 61px !important; padding-bottom: 48px !important;}
    /*#section0 .slogon span.title {font-size:33px; line-height:45px; letter-spacing: -0.96px;}
    #section0 .slogon span.title span {font-size:14px; line-height:17px; padding:0; margin-bottom: 0; letter-spacing: -0.6px;}*/
    #section0 .slogon span.title:before{width: 17px; height: 25px; top: -35px; margin-left: -8.5px;}
    #section0 .slider .control{bottom: 50px;}
    #section0 .slider .control ul li{width: 13px; height: 13px; margin-left: 11px;}
    #section0 .slider .control a.btn_stop, #section0 .slider .control a.btn_play{width: 13px; height: 12px; margin-left: 10px;}
    #section0 .slider .control .count {width: 40px; margin-right: -20px; margin-top:-45px; font-size: 18px;}
    #section0 .slider .control .count span{font-size: 25px; margin-right: 5px;}
    #section0 .slider .control .count span:after{font-size: 18px; left: 18px; top: 3px;}
    
    #section1:before{display: none;}
    #section1 .layout > div > div{height: 187px;}
    #section1 .layout > div > div:last-child{margin-top: 0;}
    #section1 .layout > div > div:first-child > a{height: 187px; background-size: contain; padding: 30px;}
    #section1 .layout > div > div:first-child > a h4{display: inline-block; font-size: 25px; line-height: 29px; width: 135px; margin-bottom: 0;}
    #section1 .layout > div > div:first-child > a h4:after{display: none;}
    #section1 .layout > div > div:first-child > a p{display: none;}
    #section1 .layout > div > div:first-child > a span.btn{padding: 0 27px; bottom: 30px; left: 30px; font-size: 14px; line-height: 37px;}
    #section1 .layout > div > div > div{width: 100%; height: auto; margin-left: 0; margin-top: 10px;}
    #section1 .layout > div > div > div:nth-child(3),#section1 .layout > div > div > div:last-child{margin-top: 10px;}
    #section1 .layout > div > div > div a{padding: 34px 25px;}
    #section1 .layout div h4{font-size: 25px; line-height: 29px; }
    #section1 .layout > div > div > div a:before{right: 25px; bottom: 50%; margin-bottom: -28.5px;}
    #section1 .layout > div > div > div:nth-child(2) a:before{right: 20px;}
    #section1 .layout > div > div > div:first-child a:before{margin-bottom: -38.5px;}
    #section1 .layout > div > div > div:nth-child(4){padding:34px 25px;}
    #section1 .layout > div > div > div:nth-child(4):before{width: 92px;height: 95px;}
	#section1 .layout > div > div > div:nth-child(4) div{position: absolute;top: 50%;margin-top: 0;left: 50%;margin-left: -112.5px;transform: translateY(-50%);}
	#section1 .layout > div > div > div:nth-child(4) div span{width:45px; height:45px; margin-left:15px;}
	#section1 .layout > div > div > div:nth-child(4) div span:nth-child(3){margin-left:15px;}
    
    #section2 .fp-tableCell{padding: 0;}
    #section2 .ani{padding: 0;}
    #section2 .tab_btn{margin:18px 0; height: 40px; width: 220px;}
    #section2 .tab_btn a{font-size: 15px; height: 40px; min-width: 120px; padding: 5px; line-height: 29px;}
    #section2 .tab_btn a.on{font-size: 16px;}
    #section2 .tab_cont .news.list .control{width: 100px; bottom: -30px; right:50%; margin-right: -50px;}
    #section2 .tab_cont .news.list .control a.btn_left, #section2 .tab_cont .news.list .control a.btn_right{width: 44px; height: 12px; background-size: contain; }
    #section2 .tab_cont .news.list{height: 345px;}
    #section2 .tab_cont .news.list .move ul li{height: 345px;}
    #section2 .tab_cont#tab01 .news.list .move ul li div a{padding: 15% 10%;}
    #section2 .tab_cont#tab01 .news.list .move ul li div a p.mv_tit{line-height: 34px; padding: 0 30px;}
    #section2 .tab_cont#tab01 .news.list .move ul li div a h4{font-size: 25px; margin-bottom: 45px;}
    #section2 .tab_cont#tab01 .news.list .move ul li div a p.date{font-size: 19px;}
    #section2 .tab_cont#tab01 .news.list .move ul li,#section2 .tab_cont#tab02 .news.list .move ul li{width: 255px;}
    #section2 .news_tab{margin-top:25px;}
    #section2 .tab_cont .news.list .move ul li div a p.mv_tit{padding:0; min-width:115px;}
    
    #section3{text-align: center;}
    #section3 h3{margin-bottom: 30px;}
    #section3 .maps{margin-bottom: 0;}
    #section3 .maps img{background: url(../images/main/sec3_map_mo.svg) no-repeat center center;  background-size: contain; }
    #section3 .maps > span{display: none;}
    #section3 .maps > span > span{display: none !important;}
    #section3 .maps .data_total{position: relative; padding: 20px 0; bottom: 0; margin-left: 0; left: 0;}
    #section3 .maps .data_total >div.t_box{display:inline-block;}
    #section3 .maps .data_total p{bottom: 50%; left: 50%; margin-left: -165px; margin-bottom: -24px; font-size: 20px; line-height: 24px;}
    #section3 .maps .data_total ul{margin-left: 120px;}
    #section3 .maps .data_total ul li strong{font-size: 33px;line-height: 37px;}
    #section3 .maps .data_total p br{display: block;}
    #section3 .maps .explan{position: static; display: inline-block; margin-right: 0; right: 0;}
    #section3 .maps .explan span{font-size: 13px;}
    #section3 .txts{background: #356fc4; padding: 5px 23px; margin-top: 0; text-align: left;}
    #section3 .txts ul li{float: none; position: relative; width: 100%; border-left: none; border-top: 2px dashed rgba(255, 255, 255, 0.7);}
    #section3 .txts ul li a{padding: 10px 0 30px;}
    #section3 .txts ul li:first-child{border-top: none;}
    #section3 .txts ul li a:after{width: 52px; height: 55px;right: 10px;}
    #section3 .txts ul li:first-child a:after{margin-top: -33.5px;}
    #section3 .txts ul li a em{display: inline-block; vertical-align: top; min-width: 105px; }
    #section3 .txts ul li a span{display: inline-block; margin-top: 0; vertical-align: middle;}
    #section3 .txts ul li a span br{display: none;}
}

@media screen and (max-width: 480px){	
    #section0 .visit_guide {bottom:25px;}
    #section0 .slider:after {bottom:40px;}
    
	#section1 .layout > div > div > div:nth-child(4) div{margin-left: -95px;}
	#section1 .layout > div > div > div:nth-child(4) div span{width:40px; height:40px; margin-left:10px;}
	#section1 .layout > div > div > div:nth-child(4) div span:nth-child(3){margin-left:10px;}
}
@media screen and (max-width: 420px){
    #section1 .layout > div > div:first-child > a h4{width: 100px;}
    #section1 .layout > div > div > div:nth-child(4){padding:20px 25px;}
    #section1 .layout > div > div > div:nth-child(4):before{width:107px; height:110px;}
    #section1 .layout > div > div > div:nth-child(4) div{position:relative; top:0; left:0; margin-top:10px; margin-left:0; transform:translateY(0);}
    
    #section3 .txts ul li span br{display: block;}
    #section3 .txts ul li a{padding: 14px 0; font-size: 23px; line-height: 27px;}
    #section3 .txts ul li a em{display: block;}
    #section3 .txts ul li a span{display: block; margin-top: 5px;}
    #section3 .txts ul li a span br{display: none;}
    #section3 .maps .data_total ul{margin-left: 95px; padding: 5px 0 5px 15px;}
    #section3 .maps .data_total ul li{margin-left: 10px;}
    #section3 .maps .data_total ul li a strong{font-size: 30px;}
    #section3 .maps .data_total p {font-size: 18px; line-height: 22px; margin-bottom: -22px; margin-left: -153px;} 
}
@media screen and (max-width: 400px){
    #section3 .maps .explan{padding: 3px 24px 12px;}
    #section3 .maps .explan span{margin: 12px auto 0;}
}
@media screen and (max-width: 380px){
    #section0 .fp-tableCell{padding: 210px 0 250px 0;}
    /* #section0 .slogon span.title{line-height: 35px;}
    #section0 .slogon span.title strong br{display: block;} */
    /*#section0 .slogon span.title span{margin-top: 10px;}*/
}
@media screen and (max-width: 360px){	
    #section0 .slogon span.title {padding:0 0 40px;}
    
    #section1 .layout > div > div > div:nth-child(4):before{width:99px; height:102px;}
    #section1 .layout > div > div > div:nth-child(4) div span{width:35px; height:35px; margin-left:8px;}
    #section1 .layout > div > div > div:nth-child(4) div span:nth-child(3){margin-left:8px;}
    
    
    #section3 .maps .data_total ul{margin-left: 85px; padding: 5px 0 5px 12px;}
    #section3 .maps .data_total ul li a{font-size: 14px; margin-left: 7px;}
    #section3 .maps .data_total p {font-size: 17px; margin-left: -146px;} 
    #section3 .maps .data_total ul li strong{font-size: 32px; margin-right: 3px;}
    
}

#section0 .slogon span.title>img.slogan_pc {display:block !important; max-width:1024px; margin:0 auto;}
#section0 .slogon span.title>img.slogan_mob {display:none !important;}

@media screen and (max-width:580px){
	#section0 .slogon span.title>img.slogan_pc {display:none !important;;}
	#section0 .slogon span.title>img.slogan_mob {display:block !important; max-width:320px; margin:0 auto;}
	#section0 .slider .move ul li span.slogon {top:180px}
}