

/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////
	
	Sub layout
	
/////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/*sub contents*/
#sub .container {position:relative; padding-top:0; height:100%; margin-top:-1px; margin-bottom:40px;}
#sub .container .detail_contents {padding:0 0 3em 0;}
.inner {width:calc(100% - 3em); margin:0 auto;}

/*sub 비주얼*/
#sVisual {position:relative; z-index:100; width:100%; height:150px; background:url(../../images/mtlight/layout/sub_tit_gnb_bg.png) no-repeat center; background-size:cover;}
/*#sVisual:after{content:''; display:block; width:100%; height:100%; position:absolute; left:0; top:0; z-index:-1; background:#fff; background:rgba(65, 65, 65, 0.2); opacity:1; -webkit-opacity:1; filter:alpha(opacity=10);}*/
#sVisual.sub01 {background:url(../../images/mtlight/layout/sub01_visual_img.png) no-repeat right top;}
#sVisual.sub02 {background:url(../../images/mtlight/layout/sub02_visual_img.png) no-repeat right top;}
#sVisual.sub03 {background:url(../../images/mtlight/layout/sub03_visual_img.png) no-repeat right top;}
#sVisual.sub04 {background:url(../../images/mtlight/layout/sub04_visual_img.png) no-repeat right top;}
#sVisual.sub05 {background:url(../../images/mtlight/layout/sub05_visual_img.png) no-repeat right bottom;}
#sVisual .text-wrap {display:table; table-layout:fixed; height:100%; z-index:100; padding:0 1em;}
#sVisual .text-wrap .title {display:table-cell; vertical-align:middle; font-size:2em; color:#333; line-height:1.6; margin:0; font-weight:600; text-shadow:0 0 20px rgba(255,255,255,0.2);}

@media screen and (max-width:640px) {
	#sVisual {height:85px;}
}

/*본문*/
#contents .content_title {padding:0.8em 0; margin-bottom:0.8em; font-size: 1.5em; font-weight: 700; color:#333; border-bottom:1px solid #ccc;}
#contents .conInner {font-size:1em; line-height:1.6; color:#333;}
#contents .conInner h3 {position: relative; margin-top:1.4em; font-size:1.6em; line-height:1.6; font-weight: 600; color: #365d90;}
#contents .conInner h3:first-child {margin-top:0;}
#contents .conInner h4 {position: relative; margin-top:15px; margin-bottom:10px; padding-left:0; font-size:1.2em; line-height: 40px; font-weight: 600; color:#333;}
/* #contents .conInner h4:before {content: ''; position: absolute; top: 15px; left: 15px; width: 7px; height: 7px; border:4px solid #365db5 ; border-radius:50%;} */
#contents .conInner .btn_big {display:block; width:calc(100%); height:auto; margin:15px 0; padding:25px 45px; border:1px solid #ccc; text-align:left; font-size:1.2rem;}

.text_center {text-align: center;}
.map_link > .btn {font-size:1em; width:100%;}


/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////
	
	컨텐츠
	
/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.contBox {position:relative;}
.contBox .photo:before {content:''; position: absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.4);}
.contBox .photo:after {content:''; position: absolute; left:40%; top:30%; width:80px; height:80px; background:url(../../images/mtlight/content/play_icon.png) no-repeat center center; opacity: 0.8;}
.contBox:focus .photo:after,
.contBox:hover .photo:after {opacity:1;}
.img_box {text-align:center; overflow-x:scroll;}

.list_ul {margin-top:1em; font-size:1em; line-height:1.8em;}
.list_ul li {position: relative; padding-left:1em;}
.list_ul li strong {font-weight:600;}
.list_ul li:before {content: ''; position:absolute; top:0.7em; left: 5px; width:0.3em; height:0.3em; background: #365db5;}

.list_ul li > .intro_sub li {position: relative; margin-bottom: 0.4em; line-height: 1.4em; color:#666666}
.list_ul li > .intro_sub li:before {content: ''; position: absolute; top:10px; left:2px; width:6px; height:1px; background: #777;}

.list_num {margin-top:20px; padding-left:2em; font-size:1em; line-height:1.8em;}
.list_num li {position: relative; color:#666666; margin-bottom:5px;}
.list_num > li strong {font-weight: 600; color:#333;}
.list_num > li span {position: absolute; left:-2.5em; top:2px; width:1.8em; height:1.8em; text-align: center; line-height:1.8em; color:#fff; background:#2173b0; font-size:0.8em; font-weight: 600;}
/*.list_num > li:nth-child(2n+1) span {background:#5792be;}*/

.submain_title {position:relative; min-height:80px; border-bottom:1px solid #eaeaea; border-top: 1px solid #eaeaea;}	
.submain_title p {height:auto; min-height:70px; padding:20px 6em 20px 1em; font-weight: 600; font-size: 1.3em; }
.submain_title p span {display:inline;}
.submain_title span.ico {position:absolute; top:45%; right:3%; width:90px; height:90px; margin-top:-40px;}
.submain_title span.ico.ty01 {background:url(../../images/mtlight/content/contBox_ico02.png) center 50% no-repeat;}
.submain_title span.ico.ty02 {background:url(../../images/mtlight/content/contBox_ico04.png) center 50% no-repeat;}
.submain_title.power p {font-size:1.6em; padding:20px 6em 20px 0.5em;}
.submain_title.power p span {font-weight:400;}
.submain_title.power p span.point {color:#6190ff; font-weight:600 !important;}


.contInto {color:#323232; margin-top:20px;}
.contInto dl {height:auto; min-height:89px; border-bottom:1px solid #eaeaea; border-top: 1px solid #eaeaea; padding:20px 0 20px 8em;}
.contInto dt {font-weight:600; font-size:1.2em; line-height:22px; margin:0 0 15px 0;}
.contInto dd {position:relative; margin-top:5px; font-size:1em; color:#494949; padding-left:1.7em;}
.contInto dl.li01 {background:url(../../images/mtlight/content/contBox_ico.png) 0 50% no-repeat; background-size: 6em;}
.contInto dd span {position: absolute; left:0px; top:10%; border-radius: 50%; width: 1.5em; height:1.5em; text-align: center; line-height:normal; color:#fff; background:#2173b0; font-size:0.8em; font-weight: 600;}
.contInto dd:nth-child(2n+1) span {background:#5792be;}

.contInto dl.li02 {background:url(../../images/mtlight/content/contBox_ico03.png) 10px 50% no-repeat; background-size: 4em; padding:30px 0 25px 6em;}
.contInto dl.li02 dt {margin:0;}
.contInto dl.li02 dd {padding-left:0;}


.grape_box {position:relative; display:block; width:100%; margin-top:10px; margin-bottom:20px; padding:0px;}

#arrow_list {text-align: center; margin-top: 30px; width:100%;}
#arrow_list > a {position:relative; overflow:hidden; display:inline-block; width:calc(100% / 2 - 5%); height:55px; font-size:1px; text-indent:-9999px; text-decoration: unset; background:url(../../images/mtlight/content/prev_btn1023.png) left center no-repeat; vertical-align:middle; box-sizing:border-box; -webkit-transition: all .8s ease; transition: all .8s ease;}
#arrow_list > a:hover, #arrow_list > a:focus {background:url(../../images/mtlight/content/prev_btn1023ov.png) left center no-repeat;}
#arrow_list > a:last-of-type {margin-left:1em; background:url(../../images/mtlight/content/next_btn1023.png) right center no-repeat;}
#arrow_list > a:last-of-type:hover, #arrow_list > a:last-of-type:focus {margin-left:1em; background:url(../../images/mtlight/content/next_btn1023ov.png) right center no-repeat;}


.board.photo ul li > .photo {min-height:150px; overflow:hidden;}

.lnkGroup {position:relative; display:flex; margin:30px auto 0;}
.lnkGroup ul {width:calc(100% / 2 - 1%);}
.lnkGroup ul.col01 {float:left; margin-left:auto; margin-right:2%;}
.lnkGroup ul.col02 {float:right; margin-right: auto;}
.lnkGroup ul li {margin:5px 0; border:1px solid #ccc;}
.lnkGroup ul li:first-child {margin:0;}
.lnkGroup ul li a.title {position: relative; display:block; width:100%; height:100%; padding:10px 2% 10px 70px;}
.lnkGroup ul li a.title:before {content:''; position:absolute; right:5%; top:40%; width:15px; height:15px; background: url(../../images/mtlight/layout/mob_depth1_bul_down.gif) no-repeat right 50%; transform: rotate(-90deg); -webkit-transform: rotate(-90deg);}
.lnkGroup ul li a.title span {position: absolute; left:0; top:0; width:55px; height:100%; display:inline-flex; justify-content:center; align-items:center; text-align: center; font-size: 0.9em; font-weight: 600; color:#fff; background:#365db5;}
.lnkGroup ul li > div.layer {display:none; top:0; left:0; z-index:999; width:100vw; height:100vh; margin:0; padding:0; align-items: center; justify-content: center; background:rgba(0,0,0,0.7); overflow: hidden;}
.lnkGroup ul li > div.layer.ov {display:flex; position:fixed;}
.lnkGroup ul li > div.layer .lnkCont {position:absolute; text-align:center; width:85%; height:auto; top:50%; left:50%; transform:translate(-50%, -50%);}
.lnkGroup ul li > div.layer .lnkCont img {box-shadow: 0 0 25px 3px; width:100%; height: auto; overflow: hidden;}
.lnkGroup ul li > div.layer .lnkCont .close {position: relative; display:block; margin:20px auto 0; color: #fff; width: 57px; height: 25px; border:1px solid #fff; border-radius:25px; /*background: url(../../images/mtlight/layout/slide_map_close.png) no-repeat center center;*/}

@media screen and (max-width:540px) {
	.lnkGroup {flex-wrap:wrap;}
	.lnkGroup ul {width:100%;}
	.lnkGroup ul.col01 {float: unset; margin-right:0;}
	.lnkGroup ul.col02 {float: unset;}
}

.tourGroup {position:relative; display:inline-block; width:100%; padding-bottom:2em; margin-top:30px; text-align:center; background:url(../../images/mtlight/content/mtour_bg-before.svg), url(../../images/mtlight/content/mtour_bg.svg); background-position:right 20px bottom 30px, bottom; background-repeat:no-repeat; background-size:20em, 140%;} 
.tourGroup > div.layout_fl {float:left; width:calc(100% / 2); padding-right:20px; margin-right:20px; border-right:1px dotted #ccc;}
.tourGroup > div.layout_fr {width:calc(100% / 2 - 20px); float:right;}
.tourGroup > div:last-child.layout_fl {border-right:none;}
.tourGroup > div img {width:100%; max-width:500px;}
.tourGroup > div > div.col ul li a {width:calc(100%); margin-top:0.5em; padding:10px 25px; font-size:1em; text-align:left; background:#f8f8f8 url(../../images/core/win.gif) no-repeat 90% 50%; background-size:1em; border:1px solid #ccc;}
.tourGroup > div > div.col ul li:hover a,
.tourGroup > div > div.col ul li:focus a {border-color:#365db5; background-color:#365db5; color:#fff;}

@media screen and (max-width:700px) {
	.tourGroup {background-position:right -35px bottom 30px, bottom; background-size:16em, 140%;}
}

@media screen and (max-width:395px) {
	.tourGroup > div.layout_fl {float:unset; width:calc(100%); padding-right:0; margin-right:0; border-right:none;}
	.tourGroup > div.layout_fr {float:unset; width:calc(100%); margin-top:30px;}
	.tourGroup {padding-bottom:18em; background-position:right 20px bottom 10px, bottom;}
}

canvas {
		-moz-user-select: none;
		-webkit-user-select: none;
		-ms-user-select: none;
		border:1px solid #666666;
		padding:5% 0
}

.covid_popup {width:100%; min-height:150px; display:block; background:#51b7bc url(../../images/mtlight/content/culture_banner_pc.jpg) left no-repeat;}
.covid_popup.type02 {width:100%; min-height:150px; display:block; background:#51b7bc url(../../images/mtlight/content/culture_banner_pc_2023.gif) left no-repeat;}
@media screen and (max-width:580px) and (orientation:portrait) {
	.covid_popup {max-height:200px; background:#51b7bc url(../../images/mtlight/content/culture_banner_vc.jpg) center no-repeat; background-size:contain;}
	.covid_popup.type02 {max-height:200px; background:#51b7bc url(../../images/mtlight/content/culture_banner_vc_2023.gif) center no-repeat; background-size:contain;}
}


/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////
	
	table

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
[data-skin="table"]{position:relative;}
[data-skin="table"]>.caption{position:absolute; right:0; bottom:calc(100% + 1em);}
[data-skin="table"]>table{width:100%; border-top:2px solid #3966CF;}
[data-skin="table"]>table th,
[data-skin="table"]>table td{padding:0.8em 1.5em; font-size:1em; border-right:1px solid #E0E0E0; border-bottom:1px solid #E0E0E0;}
[data-skin="table"]>table th:last-child,
[data-skin="table"]>table td:last-child{border-right:none;}
[data-skin="table"]>table th.left,
[data-skin="table"]>table td.left{text-align:left;}
[data-skin="table"]>table th.center,
[data-skin="table"]>table td.center{text-align:center;}
[data-skin="table"]>table th.right,
[data-skin="table"]>table td.right{text-align:right;}
[data-skin="table"]>table th.top,
[data-skin="table"]>table td.top{line-height:2.375em; vertical-align:top;}
[data-skin="table"]>table th.left_border,
[data-skin="table"]>table td.left_border{border-left:none;}
[data-skin="table"]>table th.right_border,
[data-skin="table"]>table td.right_border{border-right:none;}
[data-skin="table"]>table th{color:#3A66CF; background-color:#F8F8F8;}
[data-skin="table"]>table td{color:#666;}
[data-skin="table"]>table thead th{background-color:#F8F8F8;}

[data-skin="table"]>table [data-skin="btn"]{
	min-width:1em; height:2.375em; line-height:2.375em; padding:0 1em;
	-webkit-border-radius:0.3em;
	border-radius:0.3em;
	overflow: hidden;
}
[data-skin] + [data-skin="table"]{margin-top:2em;}

[data-skin="table"][data-type="view"]>table th,
[data-skin="table"][data-type="view"]>table td{padding:1.3em 1em;}

@media all and (max-width : 800px){
	[data-skin="table"]{overflow:auto;}
	[data-skin="table"]>table{width:900px;}
}
