@charset "UTF-8";
@import url('/font.css');

/* 1: 초기화
=========================================================================================== */
* {-webkit-text-size-adjust:none;/*가로전환시 폰트 사이즈 변환 방지*/ -webkit-tap-highlight-color: rgba(0,0,0,0);}

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, input,
blockquote, pre, abbr, address, cite, code, del, dfn, em, img,
ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, footer, header, hgroup,
menu, nav, section, summary, time, mark, audio, video, button {
	margin:0; padding:0;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block;}
h1,h2,h3,h4,h5 {font-weight:normal;}

li {list-style-type:none;}
img, fieldset, iframe {border:0;}

table {width:100%; border-collapse:collapse; border-spacing:0; text-align:inherit;}
caption {display:none;}
th, td {vertical-align:middle;}

legend {color:#000;}
img {max-width:100%; vertical-align:middle;}

li img, dd img {vertical-align:middle;}
input, select {vertical-align:middle;}
abbr, acronym {border-bottom:1px dotted; cursor:help;}

sup {vertical-align:text-top;}
sub {vertical-align:text-bottom;}
i, em, address {font-style:normal;}

a {color:inherit; text-decoration:none;}
@media(min-width:768px) {/*PC에선 전화안되게*/
	a[href^="tel"]:link,
	a[href^="tel"]:visited,
	a[href^="tel"]:hover {
		pointer-events: none;
		cursor: default;
	}
}



/* 인풋박스 스타일 */
input[type='text'],
input[type='password'],
input[type='number'],
input[type='search'],
input[type='submit'],
textarea,
select,
button {
	appearance:none;
	-moz-appearance:none;
	-webkit-appearance:none;
	font-family:'Noto Sans KR', sans-serif;
	vertical-align:middle; line-height:normal;
	font-size: 14px;
	padding:0; border:0; box-shadow:none;
	 -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
	-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;
}
input[type='text'],
input[type='password'],
input[type='number'],
input[type='search'],
input[type='submit'],
select,
textarea {
	padding: 0 10px;
	border: 1px solid #d9d9d9;
}

textarea {
	overflow-y:auto;
	resize:none;
}

button {
	font-size:100%; cursor:pointer;
	background:none;
	transition:all .3s ease; -webkit-transition:all .3s ease; -moz-transition:all .3s ease; -o-transition:all .3s ease;
}
button span {position:relative; display: inline-block; vertical-align: baseline;}


/*input 자동 채워지는 배경 색상 변경*/
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus
input:-webkit-autofill,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  -webkit-text-fill-color: #000;
  -webkit-box-shadow: none;
  transition: background-color 9999s ease-in-out 0s;
}

/*input placeholder 색상*/
::-webkit-input-placeholder,
::-moz-placeholder,
:-ms-input-placeholder,
::-ms-input-placeholder,
:-moz-placeholder,
::placeholder {color:#666;}


input::-webkit-input-placeholder {font-weight: 300; color:#666;}
input:-moz-placeholder {font-weight: 300; color:#666;}
input::-moz-placeholder {font-weight: 300; color:#666;}
input:-ms-input-placeholder {font-weight: 300; color:#666;}

/*
input::-moz-selection {color:#fff; background-color: #dc3c64;}
input::selection {color:#fff; background-color: #dc3c64;}

::-moz-selection {color:#fff; background-color: #dc3c64;}
::selection {color:#fff; background-color: #dc3c64;}
*/


/*number 화살표 없애기*/
input[type="number"]::-ms-clear {display:none;}
input[type="number"], input[type="number"]:hover, input[type="number"]:focus {-moz-appearance: textfield; -webkit-appearance: textfield; appearance: textfield;}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button,
input[type='number']:hover::-webkit-inner-spin-button,
input[type='number']:hover::-webkit-outer-spin-button {-webkit-appearance: none; margin:0;}

input[type="tel"]::-ms-clear {display:none;}
input[type="tel"]::-webkit-outer-spin-button,
input[type="tel"]::-webkit-inner-spin-button,
input[type='tel']:hover::-webkit-inner-spin-button,
input[type='tel']:hover::-webkit-outer-spin-button {-webkit-appearance: none; margin:0;}


/* 1: Base Setting
=========================================================================================== */
.hidden {display:none;}
.blind {visibility:hidden;}


.cursor {cursor:pointer;}
.non-cursor {cursor:default;}

.ta-r {text-align:right !important;}
.ta-l {text-align:left !important;}
.ta-c {text-align:center !important;}

.va-t {vertical-align:top !important;}
.va-m {vertical-align:middle !important;}
.va-b {vertical-align:bottom !important;}

.clearfix {}
.clearfix:after {content:""; clear:both; display:block;}
.fl-l {float:left;}
.fl-r {float:right;}


.blind {display:none;}
.clear {clear:both; height:0;}


.c-black {color:#000 !important;}
.c-red {color:#ff405b !important;}
.c-gray {color:#8f8d8d !important;}
.c-white {color:#fff !important;}
.c-pink {color:#ff67ac !important;}

.fz-b1 {font-size: 18px;}

.d-b {display: block;}
.d-ib {display: inline-block;}


.f-en {font-family: serif;}
.f-gm {font-family: 'GmarketSansMedium', sans-serif;}
.f-bold {font-weight: 900;}


iframe[name='google_conversion_frame'] {border:0; width:0; height:0; padding:0; margin:0; position:absolute; z-index:-1; visibility:hidden;}

.t-dot-solo {overflow:hidden; white-space:nowrap; text-overflow: ellipsis;}


 /* 2: Common Setting
=========================================================================================== */

/* 2-1: Basic
=========================== */
html {width:100%; font-size:62.5%; font-weight: 300; font-family: "Noto Sans KR", "맑은고딕", "나눔고딕", '돋움', dotum, helvetica, sans-serif, verdana;}
.inr-c {max-width:1200px; margin:0 auto;}


/*버튼*/
.btn-bot {margin-top:40px;}
.btn-bot .btn-pk {min-width:110px;}

.btn-line {padding-top: 50px; border-top: 1px solid #ddd; text-align: center; font-size: 0;}

.btn-pk {
	display:inline-block; *display:inline-block; *zoom:1; padding:16px 10px;
	color:#fff; font-size:24px; text-align: center; line-height: 1; width: 100%;
	-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
	border: 1px solid #be2020; background-color: #be2020;
	-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;
	transition:all .3s ease; -webkit-transition:all .3s ease; -moz-transition:all .3s ease; -o-transition:all .3s ease;
}
input.btn-pk {color: #fff; border: 0; height: auto; min-width:200px; font-size: 21px; padding: 15px 30px; cursor:pointer;}

@keyframes rotate{
    from{background-color: #be2020;}
    to{background-color: #edbfbf;}
}

/*탭*/
.tab {}
.tab ul {font-size: 0;}
.tab li {position: relative; display: inline-block; *display: inline; *zoom: 1; vertical-align: top; }
_::-moz-svg-foreign-content, :root .tab li {float: left;}


.tab.ty1 {margin-bottom: 30px;}
.tab.ty1 ul {display: flex; width: 100%; background-color: #fff; border-left: 1px solid #e0e0e0;}
.tab.ty1 li {flex:1; position: relative; border-right: 1px solid #e0e0e0; border-top: 1px solid #e0e0e0; border-bottom: 1px solid #e0e0e0;}
.tab.ty1 li a {display: block; padding: 17px 10px ; font-size: 16px; color: #000; text-align: center;}
.tab.ty1 li.on {background-color: #ef293a;}
.tab.ty1 li.on a {color: #fff;}


/* 2-2: Layout
=========================== */
#wrap {overflow:hidden; word-break:keep-all; word-wrap:break-word; background-color: #f9f9f9; color: #202020;}

.header {height: 50px; margin-bottom: 10px; line-height: 50px; text-align: center; background: #ffffff; border-bottom: 1px solid #bc3131;}
.header img {margin-top: 14px; height: 21px; vertical-align: top;}

.footer {padding: 20px 0 50px; text-align: center; max-width:700px; margin: 0 auto; font-size: 12px;  color: #999; white-space:pre-line;}
.footer .line {padding-top: 2em; border-top: 1px solid #eee; color: #666; font-size: 13px;}


.container {max-width:700px; margin: 0 auto; font-size: 16px; }
.container .inner {padding-bottom: 40px; box-shadow: 0 0 10px rgba(0,0,0,.1); background-color: #fff;}

.mb1 {margin-bottom: 100px !important;}
.mb2 {margin-bottom: 50px !important;}

.text {padding: 0 4.28%; margin-bottom: 60px;}

.htx1 {margin-bottom: 20px; text-align: center; font-size: 28px; font-weight: 700; letter-spacing:-0.03em; color: #000;}
.tx0 {font-size: 13px; color: #ccc; margin-bottom: 10px;}
.tx1 {font-size: 24px; letter-spacing:-0.03em; line-height: 1.7; text-align: justify;}
.tx1 strong {color: #000;}
.highlight {font-weight: 700; border-bottom: 2px solid #bc3131; color: #000;}


.event {padding: 0 4.28%; margin-bottom: 50px;}
.event img {width: 100%;}
.event .cont {padding: 30px; border: 5px solid #5a0007;}
.event .h1 {margin-bottom: 10px; font-weight: 700; font-size: 22px; color: #333;}
.event .nn {margin-bottom: 20px;}
.event .inp {padding-left: 4%; padding-right: 4%; padding-top: 20px; padding-bottom: 20px;}
.event .inp > div {position: relative; padding-left: 80px; margin-bottom: 10px; display: flex;}
.event .inp > div > label {position: absolute; left: 0; top: 0; display: block; line-height: 52px; font-size: 20px;}
.event .inp > div .select1 {width: 70%; font-size: 18px;}
.event .inp > div .inp_txt {width: 100%; font-size: 18px; height: 52px; margin-left: 5px;}
.event .inp > div .inp_txt.ml0 {margin-left: 0;}
.event .inp > div.ta-c {margin-top: 20px; padding-left: 0; padding-bottom: 0; display: block;}
.event .inp a {color: #666; border-bottom: 1px solid #666;}



.lst_radio {display: flex;}
.lst_radio .inp_radiotx {flex:1; margin-left: 5px;}
.lst_radio .inp_radiotx:first-child {margin-left: 0;}
.inp_radiotx {z-index:0; position: relative; display: inline-block; line-height: 1; min-height: 20px; vertical-align: middle;}
.inp_radiotx input {position: absolute; visibility:hidden; display: block \0/IE8;}
.inp_radiotx input + span {
	position:relative; display: block;
	color: #d18686; text-align: center;
	padding: 10px;
    background: #edbfbf;
    border-radius: 0px;
    border: 0px solid #be2020;
	cursor:pointer; vertical-align:top;
}
.inp_radiotx input:checked + span {background: #be2020; color: #fff;}


/*셀렉트 디자인*/
select.select1 {
	padding-right:30px; padding-right: 5px \0/IE8+9;
	padding-top: 0; padding-bottom: 0;
	height: 52px; line-height: 50px;
	font-family:inherit; color:#333;
	background-color: #fff;
	background-image: url('images/ico_select.png');
	background-repeat: no-repeat;
	background-position: 95% center;
	background-color: #fff \0/IE8+9;
	background-size: 15px auto;
}
select.select1::-ms-expand {display: none;}
select.select1 option {line-height:1.5; border:0;}
select.select1.b {height: 50px; font-size: 18px; padding-left: 20px; padding-right: 40px;}


.inp_radio {z-index:0; position: relative; display: inline-block; margin-right: 20px; line-height: 50px; vertical-align: middle;}
.inp_radio input {position: absolute; visibility:hidden; display: block \0/IE8;}
.inp_radio input + span {
	position:relative;
	display:inline-block;
	padding-left:30px;
	font-size: 18px; height:52px; line-height:50px;
	cursor:pointer; vertical-align:top;
}
.inp_radio input + span::after,
.inp_radio input + span:after {
	content:"";
	width:20px; height:20px;
	position:absolute; left:0; top:50%; margin-top: -11px;
	border: 1px solid #dcdcdc; background-color: #fff;
	background-image: url('images/ico_checked.png'); background-repeat: no-repeat; background-position: center center;
	background-size: 10px auto;
	-webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%;
}
.inp_radio input:checked + span::after,
.inp_radio input:checked + span:after {
   background-color: #be2020;
   border-color: #be2020;
}


.inp_checkbox {z-index:0; position: relative; display: inline-block; line-height: 1; vertical-align: middle; font-size: 0;}
.inp_checkbox input {position: absolute; visibility:hidden; display: block \0/IE8;}
.inp_checkbox input + span {
	position:relative;
	display:inline-block;
	padding-left:32px;
	font-size: 16px; min-height:25px; line-height:25px;
	cursor:pointer; vertical-align:top;
}
.inp_checkbox input + span::after,
.inp_checkbox input + span:after {
	content:"";
	width:23px; height:23px;
	position:absolute; left:0; top:0;
	background-color: #fff;
	-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
	background-image: url('images/ico_checked.png'); background-repeat: no-repeat; background-position: center center;
	background-size: 12px auto;
	border: 1px solid #dcdcdc;
}
.inp_checkbox input:checked + span::after,
.inp_checkbox input:checked + span:after {
   background-color: #be2020;
   border-color: #be2020;
}




/*팝업*/
.layerPopup {display: none; position: fixed; z-index: 1001; left: 50%; top: 50%; transform: translate(-50%, -50%);}
.layerPopup .popup {display: inline-block; *display: inline; *zoom: 1; width: 700px; background-color: #fff; position: relative; text-align: left;}
.layerPopup .p_head {position: relative; padding: 0 50px 0 30px; height: 55px; background-color: #5a0007;}
.layerPopup .p_head .tit {display: table; width: 100%; height: 100%; font-size: 22px; color: #fff; font-weight: 400;}
.layerPopup .p_head .tit span {display: table-cell; vertical-align: middle;}
.layerPopup .p_cont {overflow-y:auto; padding: 30px; max-height: calc(70vh - 55px); font-size: 16px; box-sizing:border-box;}
.layerPopup .p_cont p {white-space: pre-line;}
.layerPopup .popup .btn_close {position: absolute; right: 10px; top: 50%; margin-top: -25px; width: 50px; height: 50px; font-size: 0; text-align: center;}
.layerPopup .popup .btn_close > span {display: inline-block; vertical-align: top; font-size: 0; width: 30px; height: 2px; background-color: #fff; transform:rotate(45deg);}
.layerPopup .popup .btn_close > span:after {content:""; position: absolute; left: 0; top: 0; width: 30px; height: 2px; background-color: #fff; transform:rotate(90deg);}

.popup_dim {position: fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,.3); z-index: 1000;}



/******************************************************************************************/
@media (max-width:740px){
	.footer {font-size: 2.2vw;}
	.footer .line {font-size: 2.5vw;}

	.tx0 {margin-left: 16px; margin-right: 16px; font-size: 3vw;}
	.tx1 {font-size: 4.8vw;}
	.htx1 {font-size: 5vw;}

	.text {margin-bottom: 7vw;}

	.mb1 {margin-bottom: 10vw !important;}
	.mb2 {margin-bottom: 7vw !important;}

	.event {margin-bottom: 5vw;}
	.event .cont {padding: 5vw 4vw;}
	.event .h1 {font-size: 4.5vw; margin-bottom: 5px;}
	.event .inp {padding: 10px 0; margin-bottom: 0;}
	.event .inp > div {padding-left: 14vw;}
	.event .inp > div > label {font-size: 4vw;}
	.event .inp > div .select1,
	.event .inp > div .inp_txt {font-size: 4vw;}
	.event .inp > div .select1 {height: 45px; line-height: 43px;}
	.event .inp > div .inp_txt {height: 45px;}

	.lst_radio .inp_radiotx {margin-left: 1px;}
	.inp_radiotx input + span {font-size: 3.4vw; padding: 10px 0; letter-spacing:-0.03em;}

	.inp_radio input + span {font-size: 4vw;}
	.inp_checkbox input + span {font-size: 4vw;}


	.layerPopup {left: 0; top: 0; transform:none;}
	.layerPopup .popup {width: 100vw;}
	.layerPopup .p_head .tit {font-size: 5vw; text-align: center;}
	.layerPopup .p_cont {max-height: calc(100vh - 55px); padding: 3vw; font-size: 3.2vw;}
}