﻿@charset "utf-8";

/**************************************************
	Main CSS Document
	IEETU Web Standardization Team
	2019-07-10
**************************************************/

/**************************************************
	Common
**************************************************/

.main_visual { height:430px; overflow:hidden; position:relative;}
.main_visual .item { display:block; height:430px; background:url(../images/main/visual_bg01.png) no-repeat center top/cover;}
.main_visual .item .box { max-width:1260px; height:430px; margin:0 auto; position:relative;}
.main_visual .item .box h3 {color:#fff; font-weight:normal; font-size:44px; letter-spacing:-3px; line-height:1.5; padding-top:64px; position:relative; z-index:2; transition: 1s;transform:translateX(-50px); opacity:0;}
.main_visual .slick-active .item .box h3 { transform:translateX(0px); opacity:1;}
.main_visual .item .box img {position:absolute; right:0; bottom:0; opacity:0; transform:translateX(50px)  scale(1.05); transition: 1.5s; }
.main_visual .slick-active .item .box img { opacity:1;transform:translateX(0px)  scale(1);}
.main_visual .nav {position:absolute; left:50%; margin-left:-634px; top:290px;}
.main_visual .nav .prev , .main_visual .paging , .main_visual .next , .main_visual .play , .main_visual .pause { float:left; }
.main_visual .nav button {display:inline-block; margin:0 4px;  height:13px; text-indent:-9999px;position:relative; color:transparent; background:none; overflow:hidden;}
.main_visual .nav .play , .main_visual .nav .pause {display:none;}
.main_visual .nav .play.active , .main_visual .nav .pause.active {display:block;}
.main_visual .nav button:before {content:''; display:block; margin:0 auto; height:13px; background:url(../images/main/page.png) no-repeat; transition: 0.3s; }
.main_visual .nav .prev:before { width:8px; height:13px; background-position:0 0;}
.main_visual .nav .paging button {float:left;}
.main_visual .nav .paging button:before {width:11px; background-position:-19px 0;}
.main_visual .nav .paging button.active:before {width:11px; background-position:-8px 0;}
.main_visual .nav .next:before {width:11px; background-position:-48px 0;}
.main_visual .nav .play:before {width:9px; background-position:-39px 0;}
.main_visual .nav .pause:before {width:9px; background-position:-30px 0;}



.m_status {max-width:1260px; height:63px; margin:0 auto; overflow:hidden; position:relative; z-index:110; margin-top:-63px; background:url(../images/main/tbox_bg.png) no-repeat center top/100% 100%;}
.m_status h3 { float:left; font-size:21px; color:#fff; padding:19px 0; width:25%; text-align:center;}
.m_status h3 span { font-size:16px; font-weight:normal; margin-left:15px; display:inline-block; position:relative; top:-2px; }
.m_status h3 span:before {content:''; display:inline-block; width:16px; height:16px; background:url(../images/main/tbox_icon01.png) no-repeat; margin-right:5px; position:relative; top:2px;}
.m_status .lst { float:left; padding:13px 0; text-align:center; text-align:center;  width:25%; position:relative;}
.m_status .lst1:after {content:''; display:block; width:1px; height:17px; background:#598dbc; position:absolute; right:0; top:22px;}
.m_status .lst span {color:#fff; font-size:18px;}
.m_status .lst span:before {content:''; display:inline-block; width:25px; height:25px; background:url(../images/main/tbox_icon02.png) no-repeat; vertical-align:middle; position:relative; top:-3px; margin-right:7px;}
.m_status .lst span strong { font-size:26px; color:#ffe958; margin:0 3px 0 18px; position:relative; top:2px;}
.m_status .lst2 {width:50%; padding-right:200px;}
.m_status .lst2 span:before {background-image:url(../images/main/tbox_icon03.png); width:32px;}
.m_status .dtl_btn {position:absolute; right:20px; top:15px; display:block; width:182px; height:33px; border-radius:50px; background:#333; color:#fff; font-size:15px; text-align:center; line-height:33px;  }
.m_status .dtl_btn:before { content:'';display:inline-block; width:14px; height:15px; background:url(../images/main/tbox_icon04.png) no-repeat; position:relative; top:1px; margin-right:2px;}


.main_con {max-width:1260px; margin:0 auto 70px;}
.mt_wrap { overflow:hidden; margin:55px -10px 10px; padding-top:5px;}
.mt_wrap .m_box {float:left; width:calc(50% - 20px); margin:0 10px 30px; transition: 0.3s;}
.mt_wrap .m_box:hover {box-shadow: 0 2px 5px rgba(0,0,0,0.1); }
.mt_wrap .m_box.m_notice {border:1px solid #dfdfdf; height:280px; position:relative;}
.mt_wrap .m_box.m_notice h3 {position:absolute; left:0; top:-1px;  border-left:0;}
.mt_wrap .m_box.m_notice h3.n1 {width:calc(34% - 15px);}
.mt_wrap .m_box.m_notice h3.n2 {width:calc(33% - 15px); left:calc(34% - 15px);}
.mt_wrap .m_box.m_notice h3.n3 {width:calc(33% - 30px); left:calc(67.1% - 30px);}
.mt_wrap .m_box.m_notice h3 a {display:block; height:60px; padding:17px 0; font-weight:normal; letter-spacing:-2px; text-align:center; font-size:18px; background:#e8ebe9; border:1px solid #d3d8d5; border-left:0; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
.mt_wrap .m_box.m_notice h3 a.sel {background:#fff; border-bottom:1px solid #fff; border-top:4px solid #005aaa; font-weight:bold; color:#005aaa;}
.mt_wrap .m_box.m_notice .panelWrap {padding:80px 30px 0 30px;}
.mt_wrap .m_box.m_notice .panelWrap li {position:relative; }
.mt_wrap .m_box.m_notice .panelWrap li:before {content:''; display:block; width:5px; height:5px; border-radius:5px; background:#005aaa; position:absolute; left:0; top:15px;}
.mt_wrap .m_box.m_notice .panelWrap li a {display:block; line-height:35px; font-size:16px; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; padding:0 100px 0 16px; transition: 0.3s;}
.mt_wrap .m_box.m_notice .panelWrap li a span {display:inline-block; width:130px; font-size:14px; line-height:1.2; padding:4px 0; color:#777; margin-left:-1px; margin-right:2px; border-radius:2px; text-align:left; }
/*.mt_wrap .m_box.m_notice .panelWrap li a span.CAT_00501 { color:#e83030; border:1px solid #e83030;}
.mt_wrap .m_box.m_notice .panelWrap li a span.CAT_00502 { color:#b2782c; border:1px solid #b2782c;}
.mt_wrap .m_box.m_notice .panelWrap li a span.CAT_00503 { color:#49a318; border:1px solid #49a318;}
.mt_wrap .m_box.m_notice .panelWrap li a span.CAT_00504 { color:#6d4ac5; border:1px solid #6d4ac5;}
.mt_wrap .m_box.m_notice .panelWrap li a span.CAT_00505 { color:#1f66d1; border:1px solid #1f66d1;}
.mt_wrap .m_box.m_notice .panelWrap li a span.CAT_00506 { color:#247850; border:1px solid #247850;}
.mt_wrap .m_box.m_notice .panelWrap li a span.CAT_00507 { color:#c935bd; border:1px solid #c935bd;}
.mt_wrap .m_box.m_notice .panelWrap li a span.CAT_00500 { color:#303176; border:1px solid #303176;}
*/

.mt_wrap .m_box.m_notice .panelWrap li a:hover {color:#004bb8; text-decoration:underline;}
.mt_wrap .m_box.m_notice .panelWrap li .date {position:absolute;right:0; top:0; line-height:35px; color:#888;}
.mt_wrap .m_box.m_notice .more_btn {position:absolute; right:0; top:0; width:60px; height:59px; border-bottom:1px solid #d3d8d5; text-indent:-999px; overflow:hidden; background:#e8ebe9 url(../images/main/ico_plus.png) no-repeat center center;}

.mt_wrap .m_box.m_town {height:280px; border:1px solid #dfdfdf; padding:28px 25px; position:relative;}
.mt_wrap .m_box.m_town h3 {font-size:20px; padding-bottom:10px;}
.mt_wrap .m_box.m_town .townzone {margin:0 -5px;}
.mt_wrap .m_box.m_town .townzone .item { padding:0 6px;}
.mt_wrap .m_box.m_town .townzone .item .img {overflow:hidden; display:block; height:169px;}
.mt_wrap .m_box.m_town .townzone .item .img img {width:100%; min-height:169px; transition: 0.3s;}
.mt_wrap .m_box.m_town .townzone .item:hover .img img {transform:scale(1.1);}
.mt_wrap .m_box.m_town .townzone .item .txt {display:block; text-align:center; text-decoration:underline; padding-top:8px; transition: 0.3s;}
.mt_wrap .m_box.m_town .townzone .item:hover .txt {color:#004bb8;}
.mt_wrap .m_box.m_town .townzone .nav {position:absolute; right:22px; top:31px; overflow:hidden;}
.mt_wrap .m_box.m_town .townzone .nav .prev , .townzone .paging , .townzone .next , .townzone .play , .townzone .pause { float:left; overflow:hidden;}
.mt_wrap .m_box.m_town .townzone .nav button {display:block; margin:0 4px;  height:13px; text-indent:-9999px;position:relative; color:transparent; background:none; overflow:hidden;}
.mt_wrap .m_box.m_town .townzone .nav .play , .mt_wrap .m_box.m_town .townzone  .nav .pause {display:none;}
.mt_wrap .m_box.m_town .townzone .nav .play.active , .mt_wrap .m_box.m_town .townzone .nav .pause.active {display:block;}
.mt_wrap .m_box.m_town .townzone .nav button:before {content:''; display:block; margin:0 auto; height:13px; background:url(../images/main/page.png) no-repeat; transition: 0.3s;}
.mt_wrap .m_box.m_town .townzone .nav .prev:before { width:8px; height:13px; background-position:0 -13px;}
.mt_wrap .m_box.m_town .townzone .nav .paging button {float:left;}
.mt_wrap .m_box.m_town .townzone .nav .paging button:before {width:11px; background-position:-19px -13px;}
.mt_wrap .m_box.m_town .townzone .nav .paging button.active:before {width:11px; background-position:-8px -13px;}
.mt_wrap .m_box.m_town .townzone .nav .next:before {width:11px; background-position:-48px -13px;}
.mt_wrap .m_box.m_town .townzone .nav .play:before {width:9px; background-position:-39px -13px;}
.mt_wrap .m_box.m_town .townzone .nav .pause:before {width:9px; background-position:-30px -13px;}


.mt_wrap .m_box.m_business {height:235px; padding:40px 30px; background:#e0f2f9 url(../images/main/box_bg01.png) no-repeat right bottom; }
.mt_wrap .m_box.m_business h3 { padding-left:60px; font-size:20px; line-height:50px; background:url(../images/main/box_icon01.png) no-repeat;  }
.mt_wrap .m_box.m_business ul {padding:0px 0 0 60px;}
.mt_wrap .m_box.m_business ul li {padding:4px 0; }
.mt_wrap .m_box.m_business ul li:before {content:''}
.mt_wrap .m_box.m_business ul li a { font-size:15px; padding:0 14px 0 8px; background:url(../images/main/box_cursor01.png) no-repeat right 6px; position:relative; text-decoration:underline; transition: 0.3s;}
.mt_wrap .m_box.m_business ul li a:hover { color:#004bb8; }
.mt_wrap .m_box.m_business ul li a:before {content:''; display:block; width:3px; height:3px; background:#444; border-radius:5px; position:absolute; left:0; top:8px;}
.mt_wrap .m_box.m_business ul li a:hover:before { background:#004bb8; }

.mt_wrap .m_box.m_quick {height:235px; padding:44px 44px; background:#d6ecd9 url(../images/main/box_bg02.png) no-repeat right bottom;}
.mt_wrap .m_box.m_quick h3 { height:30px; line-height:30px; font-size:25px; padding-left:40px; background:url(../images/main/box_icon05.png) no-repeat;}
.mt_wrap .m_box.m_quick p {margin:10px 0 20px; line-height:1.4;}
.mt_wrap .m_box.m_quick a {display:block; width:110px; height:34px; padding-left:6px; line-height:32px; text-align:center; border:1px solid #333; border-radius:50px; transition: 0.3s;}
.mt_wrap .m_box.m_quick a:after {content:''; display:inline-block; width:5px; height:7px; background:url(../images/main/box_cursor01.png) no-repeat; position:relative; top:-2px; margin-left:7px;}
.mt_wrap .m_box.m_quick a:hover {background:#fff;}

.m_gallery {border:1px solid #dfdfdf; padding:28px 30px 35px; position:relative; transition: 0.3s;}
.m_gallery:hover {box-shadow:0 2px 5px rgba(0,0,0,0.1);}
.m_gallery h3 {font-size:20px; padding-bottom:12px;}
.m_gallery h3 span {font-weight:normal;}
.m_gallery ul {overflow:hidden; margin:0 -1.5%;}
.m_gallery ul li {float:left; width:22%; margin:0 1.5%;}
.m_gallery ul li .img { display:block; height:170px; overflow:hidden;}
.m_gallery ul li .img img {width:100%; min-height:170px; transition: 0.3s;}
.m_gallery ul li:hover .img img {transform: scale(1.1);}
.m_gallery ul li .txt {text-align:center; display:block; padding:10px 10px 0; font-size:16px; overflow:hidden; white-space:nowrap; text-overflow: ellipsis; transition: 0.3s;}
.m_gallery ul li:hover .txt {color:#004bb8;}
.m_gallery .more_btn {position:absolute; right:30px; top:19px; display:block; width:32px; height:32px; border:1px solid #111; background:url(../images/main/ico_plus2.png) no-repeat center center; overflow:hidden; text-indent:-999px; transition: 0.3s;}
.m_gallery .more_btn:hover {transform: rotate(180deg); border:1px solid #aaa;}

#lypop_POPUP_00000000000011{}
#lypop_POPUP_00000000000011 .btm{background: #ffffff;    border-bottom: 1px solid #d3d3d3;    padding: 5px;}

/* Tablet 1024px ~ 1199px */
@media screen and (max-width:1259px){
	/**************************************************
		Common
	**************************************************/
	.main_con {margin-bottom:40px;}
	
	.main_visual .item .box {padding:0 15px;}
	.main_visual .item .box h3 {font-size:38px; }
	.main_visual .item .box img {right:15px; width:600px;}
	.main_visual .nav {left:15px; margin-left:0;}
	
	.m_status h3 {font-size:17px; padding:19px 0;}
	.m_status h3 span {font-size:15px;}
	.m_status .lst {padding:15px 0;}
	.m_status .lst span {font-size:16px;}
	.m_status .lst span:before {top:-1px; width:19px; height:19px; background-size:100% auto;}
	.m_status .lst2 span:before {width:23px;}
	.m_status .lst2 {padding-right:190px;}
	.m_status .lst span strong {font-size:21px; margin-left:8px; margin-right:0;}
	
	
	.mt_wrap {margin:30px 5px 10px;}
	.mt_wrap .m_box.m_notice h3 a {font-size:17px;}
	
	.m_gallery {margin:0 15px;}
}



/* Tablet 768px ~ 1023px */
@media screen and (max-width:1023px){
	/**************************************************
		Main
	**************************************************/
	.main_visual {height:360px;}
	.main_visual .item {height:360px;}
	.main_visual .item .box {height:360px;}
	.main_visual .item .box h3 {font-size:30px; padding-top:45px; }
	.main_visual .item .box img { width:500px;}
	.main_visual .nav {top:205px;}
	
	
	.mt_wrap .m_box {background-size:auto 75% !important;}
}


/* Mobile 640px ~ 767px */
@media screen and (max-width:820px){
	/**************************************************
		Main
	**************************************************/
	.m_status {height:auto; background:#005098;}
	.m_status h3 {float:none; width:auto; padding:12px 0;}
	.m_status .lst {float:none; width:auto; padding:10px 0 2px; margin:0 30px; background:#005aaa; border-radius:6px 6px 0 0;}
	.m_status .lst:after {display:none;}
	.m_status .lst2 {padding:2px 0 10px; border-radius:0 0 6px 6px;}
	.m_status .dtl_btn {position:inherit; top:inherit; right:inherit; margin:12px auto 16px;}
	
	.mt_wrap .m_box {float:none; width:auto; margin-bottom:15px;}
	.m_gallery ul li .img {height:120px;}
	.m_gallery ul li .img img {min-height:120px;}
	
	.mt_wrap .m_box.m_town {height:auto;}
	.mt_wrap .m_box.m_town .townzone .item .img {height:auto;}
	.mt_wrap .m_box.m_town .townzone .item .img img {min-height:inherit;}
	
}
/* Mobile 320px ~ 639px */
@media screen and (max-width:580px){
	/**************************************************
		Main
	**************************************************/
	.main_visual {height:auto;}
	.main_visual .item {height:auto;}
	.main_visual .item .box {height:auto;}
	.main_visual .item .box h3 {text-align:center; padding-top:30px; font-size:30px; letter-spacing:-4px; line-height:1.2;}
	.main_visual .item .box img {position:inherit; right:inherit; bottom:inherit; width:94%; max-width:440px; display:block; margin:45px 3% 0;}
	.main_visual .nav {left:0; right:0; top:152px; text-align:center;}
	.main_visual .nav * {float:none !important; display:inline-block !important;}
	.main_visual .nav .play , .main_visual .nav .pause {display:none !important;}
	.main_visual .nav .play.active , .main_visual .nav .pause.active {display:inline-block !important;}
	
	.m_status .lst {margin:0 16px;}
	
	
	.mt_wrap .m_box.m_notice {height:auto; padding-bottom:12px;}
	.mt_wrap .m_box.m_notice h3.n1 {width:23%;}
	.mt_wrap .m_box.m_notice h3.n2 {width:23%; left:23%;}
	.mt_wrap .m_box.m_notice h3.n3 {width:calc(54% + 1px); left:46%;}
	.mt_wrap .m_box.m_notice h3 a {font-size:15px; letter-spacing:-2.5px;}
	.mt_wrap .m_box.m_notice .panelWrap {padding:70px 18px 0 16px; height:auto;}
	.mt_wrap .m_box.m_notice .panelWrap li a {padding-right:78px; padding-left:12px; font-size:15px;}
	.mt_wrap .m_box.m_notice .more_btn {position:inherit; right:inherit; top:inherit; display:block; width:100%; height:38px; text-align:center; letter-spacing:-1.6px; line-height:36px;  border:1px solid #ccc; border-radius:50px; text-indent:0px; background:#fff; margin:20px auto 10px;}
	
	.mt_wrap .m_box.m_town {padding:18px; height:auto;}
	.mt_wrap .m_box.m_town .townzone .nav {right:10px; top:22px;}
	.mt_wrap .m_box.m_business {padding:18px; height:180px;}
	.mt_wrap .m_box.m_quick {padding:24px; height:auto;}
	.mt_wrap .m_box.m_quick h3 {font-size:20px; padding-left:36px;}
	
	.m_gallery {padding:18px 18px 6px; height:auto;}
	.m_gallery ul li {width:47%; margin-bottom:20px;}
	.m_gallery ul li .img {height:140px;}
	.m_gallery ul li .img  img {min-height:140px;}
	.m_gallery .more_btn {right:18px; top:21px; width:22px; height:22px;}
	

}

@media screen and (max-width:460px){
	
	
	.main_visual .item .box h3 { font-size:25px; letter-spacing:-2.8px;}
	.main_visual .nav { top:132px; }
	
	.mt_wrap .m_box.m_town .townzone .nav {position:inherit; right:inherit; top:inherit; margin:23px auto 5px; width:234px;}
	
	.main_top .item { padding:0 5px; width:260px !important;}
	.main_top .item div {padding-bottom:10px;}
	.main_top .item .tit {font-size:17px; height:37px; margin:25px 7px 25px;}
	.main_top .item ul {padding-bottom:12px; margin:0 6px 0 12px;}
	.main_top .item ul li {font-size:13px; min-height:24px; padding:3px 0 3px 29px;}
	.main_top .item ul li:before {width:24px; height:24px; background-size:100%;}
	.main_top .item ul li.n2:before {background-position:0 -24px;}
	.main_top .item ul li.n3:before {background-position:0 -48px;}
	.main_top .item a {margin:20px auto 12px; transform:scale(0.8)}
	
	.m_gallery ul li .img {height:116px;}
	.m_gallery ul li .img  img {min-height:116px;}
	
}
@media screen and (max-width:400px){
	.mt_wrap .m_box.m_business ul {padding-left:25px; padding-top:10px;}
	.mt_wrap .m_box.m_quick p {word-break: keep-all;}
	.mt_wrap .m_box.m_quick p br {display:none;}
	
	.m_gallery ul li .img {height:96px;}
	.m_gallery ul li .img  img {min-height:96px;}
	
}