@charset "utf-8";
/* CSS Document */
html{font-size:18px;}
body{
	font-family:'NanumBarunGothic';
	line-height: 1.5;
    color: #111;
	overflow-y: scroll;font-weight: 400;
    letter-spacing:-0.04em;
}
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video,img {
	margin: 0;
	padding: 0;
	border: 0;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
    width:100%;
	border-collapse: collapse;
	border-spacing: 0;
}
html,body{height: 100%;}

/* 공통 */
a{text-decoration:none; color: inherit}
a:hover:not(.line-no){text-decoration-line:underline;}
input[type="text"],input[type="password"],textarea{
	appearance:none ;-webkit-appearance:none;-moz-appearance:none;
	border:1px solid #ccc;
	border-radius: 0; -moz-border-radius: 0; -webkit-border-radius: 0;
	font: inherit;
    padding:0 0.714em;
    font-size:0.778em;
    height:2.222rem;
    width:7.929em;
    vertical-align:middle;
}
input[type="button"]{
	appearance:none ;-webkit-appearance:none;-moz-appearance:none;
	border-radius: 0; -moz-border-radius: 0; -webkit-border-radius: 0;
	font: inherit;
	border: 0
}
input[type="checkbox"]{margin: 0}
input::placeholder{color:#999;}
select{
	border: 1px solid #ccc;
	border-radius: 0px; -moz-border-radius: 0px; -webkit-border-radius: 0px;
	-webkit-appearance: none; -moz-appearance: none; appearance: none;
	font: inherit;
	background: #fff url('../img/common/select.png') right 1em center no-repeat;
	padding: 0 2.857em 0 0.714em;
    font-size:0.778em;
    height:2.222rem;
    line-height:100%;
    width:7.929em;
    cursor:pointer;
    vertical-align:middle;
}
select::-ms-expand {
    display: none;
}
h1, h2, h3, h4, h5, h6, strong{font-weight:700;}
*{box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
#header *,#left *,#sub_w{box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
img{max-width: 100%;vertical-align: middle}
.mt0{margin-top:0px !important}
.mt10{margin-top:10px !important}
.mt15{margin-top:15px !important}
.mt20{margin-top:20px !important}
.mt30{margin-top:30px !important}
.mt40{margin-top:40px !important}
.mt50{margin-top:50px !important}

.mt1p{margin-top: 1% !important}
.mt2p{margin-top: 2% !important}
.mt3p{margin-top: 3% !important}
.mt4p{margin-top: 4% !important}
.mt5p{margin-top: 5% !important}
.mt6p{margin-top: 6% !important}
.mt7p{margin-top: 7% !important}
.mt8p{margin-top: 8% !important}
.mt9p{margin-top: 9% !important}
.mt10p{margin-top: 10% !important}
.mb0{margin-bottom: 0 !important}
h1,h2,h3,h4,h5{font-size: 1em}
button,input[type="button"]{
	margin: 0;
  padding: 0;
  border: none;
  background: none;
	font:inherit;
}
button,label{cursor: pointer;}
address,em{font-style: normal}
.inner{max-width: 1200px; margin: 0 auto;}
.align_l{text-align: left}
.align_c{text-align: center}
.align_r{text-align: right}
.fl{float: left}
.fr{float: right}
.clearfix:after{content: ''; display: block; clear: both}
.mobile{display: none}

/* 세로 가운데 정렬 */
.table{display: table; width: 100%;}
.table > *, .vertical{display: table-cell; vertical-align: middle}
.table-fixed{table-layout:fixed;}

#action_ifrm{
	position: absolute;
	left: 20px;
	top: 3000px;
	display: none;
}
.ellipsis{display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.hide,.hidden,caption{position:absolute; visibility:hidden; width:0px; height:0px; top:0px; left:0px; overflow:hidden; font-size:0px; float:left; clear:both;}
.w100p{width: 100%}
#wrap{overflow: hidden; position: relative;}
.modal{display: none}
.slick-dots{text-align:center}
.slick-dots li{display: inline-block}
.slick-dots button{display:block;white-space: nowrap;overflow: hidden;text-indent: -999px}
.tablet{display: none}
.block-pc{display: block}
.trans{
	-moz-transition: all .3s ease-in-out;
  -webkit-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  -ms-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}
.slick-arrow{white-space: nowrap;overflow: hidden;text-indent: -999px;display: block}

/* 반응형 */
@charset "utf-8";

/* 반응형 */
.fifths, .fourths, .half, .thirds{position:relative;overflow:hidden;width:100%;}
.fifths > *{float:left;width:20%;position:relative;}

.fourths > *{float:left;width:25%;position:relative;}
.fourths.interval > *{width:calc(25% - 1em);margin:0 0.667em 1.333em;}

.thirds > *{float:left;width:33.33%;}
.thirds:not(.interval) > *:nth-child(3n){width:33.34%;}
.thirds.interval > *{width:calc(33.33% - 0.67em);margin:0 0.5em 1em;}
.thirds.interval.mg-per > *{width:32%;margin:0 1%;}

.half > *{float:left;width:50%;position:relative;}
.half.interval > *{width:calc(50% - 0.5em);margin-right:1em;}
.half.align-justify > :nth-child(2n){float:right!important}
.half:not(.origin-width) > :last-child:nth-child(2){float:right;}

.fifths.interval > *:nth-child(5n-4), .fourths.interval > *:nth-child(4n-3), .thirds.interval > *:nth-child(3n-2), .half.interval > *:nth-child(2n-1){margin-left:0;}
.fifths.interval > *:nth-child(5n), .fourths.interval > *:nth-child(4n), .thirds.interval > *:nth-child(3n), .half.interval > *:nth-child(2n){margin-right:0;}
.fifths.origin-width > *, .fourths.origin-width > *, .thirds.origin-width > *, .half.origin-width > *{width:auto!important;}
.fifths.no-margin > *, .fourths.no-margin > *, .thirds.no-margin > *, .half.no-margin > *{margin-bottom:0!important;}

.table{display: table;}
.table.w100{width:100%!important;}
.table > *, .vertical{display: table-cell; vertical-align: middle;}
.table-fixed{table-layout:fixed;}

.left{float:left;}
.right{float:right;}

.max-3 > *{max-width:32%;}

.m-only{display:none;}

.effect-cover{object-fit:cover;margin:0 auto;}

@media screen and (max-width:640px) {
    .fifths:not(.keep):not(.div-st01) > *:not(.keep-child), .fourths:not(.keep):not(.div-st01) > *:not(.keep-child), .thirds:not(.keep):not(.div-st01) > *:not(.keep-child), .half:not(.keep):not(.div-st01) > *:not(.keep-child){float:none;width:100%!important;display:block;min-height:auto;margin-left:0;margin-right:0;}
    .fifths:not(.no-margin) > *, .fourths:not(.no-margin) > *, .thirds:not(.no-margin) > *, .half:not(.no-margin) > *{margin:1em auto;}
    .fourths:not(.keep) > *:first-child, .thirds:not(.keep) > *:first-child, .half:not(.keep) > *:first-child{margin-top:0!important;}
	.fourths:not(.keep) > *:last-child, .thirds:not(.keep) > *:last-child, .half:not(.keep) > *:last-child{margin-bottom:0!important;}
    .fourths.mg-0 > *, .thirds.mg-0 > *, .half.mg-0 > *{margin-top:0!important;margin-bottom:0!important;}
    .fifths.div-st01 > *, .fourths.div-st01 > *, .thirds.div-st01 > *{width:50%;margin-bottom:1em;}
    .fifths.div-st01 > *::after, .fourths.div-st01 > *::after, .thirds.div-st01 > *::after{display:none!important;}
    .fifths.origin-width:not(.no-center), .fourths.origin-width:not(.no-center), .thirds.origin-width:not(.no-center), .half.origin-width:not(.no-center){text-align:center;}
    .fifths.origin-width > *:not(.keep-child), .fourths.origin-width > *:not(.keep-child), .thirds.origin-width > *:not(.keep-child), .half.origin-width > *:not(.keep-child){float:none;display:inline-block;}
	.div-st01 > *{margin:0 0 1em;}
	.interval.div-st01 > *{width:calc(50% - 0.5em)!important;margin:0;}
	.interval.div-st01 > *:nth-child(2n){margin:0 0 1em 1em;}
	.table.tiering > *{display:block;width:100%!important;}
	.table:not(.keep){display:block;}
    .table:not(.keep) > *{display:block;width:100%!important;}

    .pc-only{display:none}
    .m-only{display:block;}
}
