@charset "utf-8";

/* Write */
body .form-control{ box-shadow:none;}
.write-wrap h2 { padding:0px; margin:0px; font-size:14px; font-weight:bold; }
.write-wrap label { font-weight:bold; margin-top:4px; }
.write-wrap .control-label { padding-top:0px; }
.write-wrap .write-content { height: 300px; }
.write-wrap .write-file { border:0;box-shadow:none; }
.write-wrap .write-btn { margin:15px 0px 25px; text-align:center; }
.write-wrap .delete-file { margin:0px; padding:0px 10px; font-weight:normal; }
.write-wrap .delete-file label { font-weight: normal; }
.write-wrap .sp-label { font-weight:normal; margin-right:10px; }
.write-wrap .sp-label input[type="checkbox"], .write-wrap .sp-label input[type="radio"] { margin-top:0px; }

#autosave_pop div { text-align:right; }
#autosave_pop button { margin:0; margin-left:10px; padding:0; border:0; background:transparent; color:#888; }
#autosave_pop ul { margin:0; padding:0; padding-left:15px; list-style:disc; }
#autosave_pop li { padding:2px 5px;  }
#autosave_pop li:after { display:block; visibility:hidden; clear:both; content:""; }
#autosave_pop a { display:block; float:left; }
#autosave_pop span { display:block;; float:right; }

#variableFiles { width:100%; margin:0; border:0; }
#variableFiles td { padding:0px 0px 7px; border:0; }
#variableFiles input[type=file] { box-shadow : none; border: 1px solid #ccc !important; outline:none; }
#variableFiles .form-group { margin-left:0; margin-right:0; margin-bottom:7px; }
#variableFiles .checkbox-inline { padding-top:0px; font-weight:normal; }


/* 글쓰기 추가 */
input[type=checkbox]{margin:0;margin-right:5px;vertical-align: initial;}
.dis-no{display:none;}
.lineH{line-height:1;}
.wirte_container_con_inner{border-top:2px solid #333; padding:0 0 40px; border-bottom:1px solid #ddd; }

.wirte_container{ margin-top:40px;  display:flex; flex-wrap:wrap;  }
.wirte_container:after{ content:""; clear:both; display:block; }
.wirte_container > div{ float:left; }
.wirte_container .wirte_tit{ width:180px; display:flex; align-items:center; }
.wirte_container .wirte_content{ width:calc(100% - 180px);}

.wirte_container_grid > div{ float:left; width:49%; margin-left:2%; }
.wirte_container.mg{ border-bottom:1px solid #ddd; padding-bottom:40px; }
.wirte_container.mg .wirte_content{ width:100%;   }

.wirte_container .wirte_tit label{font-size:18px;margin-top:0; line-height:160%; }
.wirte_container .wirte_content_inner label{font-size:16px;margin:0;line-height: 25px;}
.wirte_container .wirte_content_inner label:not(:first-of-type){margin-left:50px;}
.wirte_container .wirte_content_inner select{width:100%;-moz-appearance: none; -webkit-appearance: none; appearance: none;background:url("/thema/Basic/img/write_basic_icon02.png") no-repeat right center;background-position-x: 95%;}
.wirte_container .wirte_content_inner select::-ms-expand{display: none;}
.wirte_container .wirte_content_inner #captcha #captcha_info{font-size:14px;margin-top:15px;}
.wirte_container > div.wirte_content .input-sm{font-size:14px;height:60px;border:1px solid #ddd;padding:0 25px;border-radius:0; width:100%;}

.wirte_container > div.wirte_content{ position:relative; }
.wirte_container > div.wirte_content textarea.input-sm{padding:25px;}
.wirte_container > div.wirte_content .custom_checkbox{ position:absolute; top:0px; left:0px; opacity:0; }
.wirte_container > div.wirte_content .custom_checkbox + label{ position:relative; padding-left:40px; cursor:pointer; font-weight:500;}
.wirte_container > div.wirte_content .custom_checkbox + label:after{ content:""; position:absolute; top:0; left:0; width:25px; height:25px; background:url("/thema/Basic/img/write_basic_check01.png") no-repeat left top;transition: all 0.3s;background-size: contain;}
.wirte_container > div.wirte_content .custom_checkbox:checked + label:after{background:url("/thema/Basic/img/write_basic_check02.png") no-repeat left top;background-size: contain;}
.wirte_container > div.wirte_content .custom_checkbox:focus + label{ border:1px dotted #333;}

.wirte_btn_box{display:block;margin: 60px auto 0;max-width:260px;height:65px; line-height:65px; color:#fff; }
.wirte_btn_box button{font-size:18px;width:100%;cursor:pointer; background:#002a90; transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s;}
/* .wirte_btn_box button:hover ,
.wirte_btn_box button:focus{ background:linear-gradient(to left, #366bb3, #00b1bb);} */

.file_btn_box_container .file_btn_box_con{ margin-bottom:15px; display:flex;   }
.file_btn_box_container .file_btn_box_con:last-child{ margin-bottom:0px; }
.file_btn_box_container .file_btn_box_con > p,
.file_btn_box_container .file_btn_box_con > div{ float:left; position:relative;  }
.file_btn_box_container .file_btn_box_con > div.file_btn_box_remove{ display:flex; align-items:center; padding-left:10px;  }
.file_btn_box_container .file_btn_box_con > p{ font-size: 16px;  height: 70px; line-height:70px;   border: 1px solid #ddd;   padding: 0 25px; max-width:550px; flex:1; margin:0px; color:#777; }
.file_btn_box_container .file_btn_box_con > div label.file_btn_box_label{
	font-size:0; height:100%;  width:70px; border:1px solid #ddd; display:flex; align-items:center; justify-content:center; /* transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s;  */
	margin-left:10px; background-image:url("/thema/Basic/img/contact_file_icon.png"); background-repeat:no-repeat; background-position:center;
}
.file_btn_box_container .file_btn_box_con > div input.file_btn_box_input{ position:absolute; top:0; left:0; width:100%; height:100%; opacity:0; cursor:pointer; }
/* 웹접근성 포커스링 추가(22.12.20) */
.file_btn_box_container .file_btn_box_con > div input.file_btn_box_input:hover + label,
.file_btn_box_container .file_btn_box_con > div input.file_btn_box_input:focus + label{background-color:#f2fbfb; border-color:#00b1bb; outline:2px solid red; outline-offset:-3px;}



@media all and (max-width:1024px) {
	.wirte_container_con_inner{ padding-bottom:30px; }
	.wirte_container{ margin-top:30px; }
	.wirte_container.mg{ padding-bottom:30px; }
	.wirte_container .wirte_content_inner label{ font-size:14px; }
	.wirte_container .wirte_content_inner label:not(:first-of-type){ margin-left:15px; }
	.wirte_container .wirte_tit{ width:130px; }
	.wirte_container .wirte_content{ width:calc(100% - 130px);}
	.wirte_container .wirte_tit label{ font-size:16px; }
	.wirte_container > div.wirte_content .input-sm{ height:55px;  }
	.file_btn_box_container .file_btn_box_con > p{ height:55px; line-height:55px; font-size:14px;  }
	.file_btn_box_container .file_btn_box_con > div label.file_btn_box_label{ width:60px; }

	.wirte_btn_box{ margin: 30px auto 0; max-width:200px ;height:55px; line-height:55px;  }
	.wirte_btn_box button{font-size:16px;  }
}

@media all and (max-width:768px) {
	.wirte_container .wirte_tit{ width:100%; margin-bottom:10px;  }
	.wirte_container .wirte_content{ width:100%;}
	
	.wirte_container > div.wirte_content textarea.input-sm{ padding:15px; }
	.wirte_container > div.wirte_content .input-sm{ height:45px; padding:0 15px; }
	.file_btn_box_container .file_btn_box_con > p{ height:45px; line-height:45px; padding:0 15px;  }

	/* .file_btn_box_container .file_btn_box_con{ flex-wrap:wrap; } */
	.file_btn_box_container .file_btn_box_con > p{ flex:none; width:calc(95% - 60px); }
	.file_btn_box_container .file_btn_box_con > div.file_btn_box_remove{ width:100%; padding-left:0px; margin-top:5px; }
}

/* 추가 */
.contact_top_info {background-color:#f2f2f2; padding:50px 0; text-align:center;}
.contact_top_info ul {font-size:0;}
.contact_top_info ul li {display:inline-block; font-size:18px; line-height:130%; vertical-align:middle; text-align:left; margin-right:60px; padding-right:60px; position:relative;}
.contact_top_info ul li:after {content:''; position:absolute; top:50%; right:0; margin-top:-27px; width:1px; height:54px; background-color:#ddd;}
.contact_top_info ul li:last-child:after {display:none;}
.contact_top_info ul li b {display:block; margin-bottom:5px;}
h4.contact_title {font-size:32px; line-height:120%; margin-bottom:35px; }
strong.contact_sub_title {font-size:24px; line-height:120%; display:block; margin:30px 0 15px; }
.contact_btm .contact_btm_privacy {height:280px; overflow-y:auto; border:1px solid #ddd;}
.contact_btm p {position:relative; margin-top:20px}
.contact_btm p input {position:absolute; top:0; left:0; opacity:0;}
.contact_btm p label {font-size:16px; line-height:130%; font-weight:700; padding-left:35px;  cursor:pointer;}
.contact_btm p input + label:after{ content:""; position:absolute; top:1px; left:0; width:25px; height:25px; background-color:#ddd; background-position:center; background-repeat:no-repeat; 
	transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s;  background-image:url('/thema/Basic/img/auto_save_checked.png');
}
.contact_btm p input:checked + label:after{background-color:#333;}
.contact_btm p input:focus + label {border: 1px dotted #333;}

@media all and (max-width:1200px){
	.contact_top_info ul li {font-size:16px; margin-right:30px; padding-right:30px;}
}

@media all and (max-width:991px){
	.contact_top_info {padding:25px 15px;}
	.contact_top_info ul li {font-size: 15px; width:100%; margin-bottom:10px; margin-right:0; padding-right:0;}
	.contact_top_info ul li:last-child {margin-bottom:0;}
	.contact_top_info ul li:after {display:none;}
}


/* 추가 */
.contact_txt_box {display:flex; flex-wrap:wrap; align-items:center;}
.contact_txt_box .left_box strong {font-size:32px; line-height:160%; font-weight:500;}
.contact_txt_box .left_box strong b {font-weight:700;}
.contact_txt_box .right_box {margin-left:auto; padding:35px 25px; display:flex; flex-wrap:wrap; align-items:center; border-top:2px solid #333; border-bottom:1px solid #ddd;}
.contact_txt_box .right_box h3  {font-size:18px; line-height:130%; background-image:url("/thema/Basic/img/contact_icon.png"); background-repeat:no-repeat; background-position:left center; padding-left:30px;}
.contact_txt_box .right_box strong {font-size:32px; line-height:130%; color:#002a90; margin:0 15px;}
.contact_txt_box .right_box p {font-size:16px; line-height:130%; color:#333;}

.wirte_container_con_inner.contact_privacy .wirte_container .wirte_tit {align-items:normal;}
.wirte_container_con_inner.contact_privacy .wirte_content_inner {border:1px solid #ddd; padding:25px; margin-bottom:25px;}
.wirte_container_con_inner.contact_privacy .wirte_content_inner > p {font-size:16px; color:#333; line-height:160%; margin-bottom:15px;}
.wirte_container_con_inner.contact_privacy .wirte_content_inner .square_list li {font-size:16px; color:#333; line-height:160%; margin-bottom:15px; position:relative; padding-left:15px;}
.wirte_container_con_inner.contact_privacy .wirte_content_inner .square_list li:last-child {margin-bottom:0;}
.wirte_container_con_inner.contact_privacy .wirte_content_inner .square_list li:before {content:''; position:absolute; top:8px; left:0; width:6px; height:6px; background-color:#9dc93a;}
.wirte_container_con_inner.contact_privacy .wirte_container .wirte_content p label {font-size:18px; line-height:130%;}

/* 캡챠 */
#captcha {display:block;}
#captcha .wrap {display:flex; flex-wrap:wrap;}
#captcha .wrap .captcha_icon_box {font-size:0; margin-left:10px;}
#captcha .wrap .captcha_icon_box button {font-size:0;}
#captcha .wrap .captcha_icon_box button#captcha_mp3 {
	width:70px; height:70px; border-right:1px solid #ddd; border-top:1px solid #ddd; border-bottom:1px solid #ddd;  border-right:1px solid #ddd; border-left:1px solid #fff;
	background-image:url("/thema/Basic/img/sound_icon.png"); background-repeat:no-repeat; background-position:center;
}
#captcha .wrap .captcha_icon_box button#captcha_reload {
	width:70px; height:70px; border:1px solid #ddd;
	background-image:url("/thema/Basic/img/re_icon.png"); background-repeat:no-repeat; background-position:center;
}
#captcha .wrap .captcha_icon_box button#captcha_mp3:hover, #captcha .captcha_icon_box button#captcha_mp3:focus {border-color:#00b1bb; background-color: #f2fbfb; border-left:1px solid #00b1bb;}
#captcha .wrap .captcha_icon_box button#captcha_reload:hover, #captcha .wrap .captcha_icon_box button#captcha_reload:focus {border-color:#00b1bb; background-color: #f2fbfb;}
#captcha .wrap .img_box #captcha_img {width:250px; height:70px; padding:10px 60px;}
#captcha #captcha_key.captcha_box {width:400px; height:70px; padding:0 25px; background-color:#fff !important; border:1px solid #ddd; margin-top:10px;}

/* 웹접근성 포커스링 추가(22.12.20) */
#captcha .wrap .captcha_icon_box button#captcha_reload:focus,
#captcha .wrap .captcha_icon_box button#captcha_mp3:focus {outline:2px solid red; outline-offset:-3px;}

@media all and (max-width:1230px){
	.contact_txt_box .left_box strong {font-size:26px;}
	.contact_txt_box .right_box {padding:25px;}
	.contact_txt_box .right_box h3 {font-size:16px; background-size:20px; padding-left:25px;}
	.contact_txt_box .right_box strong {font-size:30px; margin:0 10px;}
	.contact_txt_box .right_box p {font-size:15px;}
}
@media all and (max-width:1024px){
	.contact_txt_box .left_box strong {font-size:20px;}
	.contact_txt_box .right_box {display:block; text-align:center; padding:10px 20px;}
	.contact_txt_box .right_box h3 {display:inline-block; font-size:15px; background-size:15px; padding-left:20px;}
	.contact_txt_box .right_box strong {display:block; margin:0; font-size:24px;}
	.contact_txt_box .right_box p {font-size:14px;}

	/* 캡챠 */
	#captcha .wrap .img_box #captcha_img, #captcha #captcha_key.captcha_box {height:55px; line-height:55px;}
	#captcha .wrap .captcha_icon_box button#captcha_mp3 {width:55px; height:55px; background-size:30px;}
	#captcha .wrap .captcha_icon_box button#captcha_reload {width:55px; height:55px; background-size:22px;}

	.file_btn_box_container .file_btn_box_con > div label.file_btn_box_label {background-size:20px;}
	.wirte_container_con_inner.contact_privacy .wirte_content_inner {padding:15px 20px; margin-bottom:20px;}
	.wirte_container_con_inner.contact_privacy .wirte_content_inner > p {font-size:14px; margin-bottom:10px;}
	.wirte_container_con_inner.contact_privacy .wirte_content_inner .square_list li {font-size:14px; margin-bottom:10px; padding-left:13px;}
	.wirte_container_con_inner.contact_privacy .wirte_content_inner .square_list li:before {top:7px; width:5px; height:5px;}
	.wirte_container_con_inner.contact_privacy .wirte_container .wirte_content p label {font-size:16px;}
}
@media all and (max-width:768px){
	.contact_txt_box .left_box strong {font-size:18px;}
	.contact_txt_box .right_box h3 {font-size:14px;}
	.contact_txt_box .right_box strong {font-size:20px;}
	.contact_txt_box .right_box p {font-size:13px;}

	/* 캡챠 */
	#captcha .wrap .captcha_icon_box {margin-left:7px;}
	#captcha .wrap .captcha_icon_box button#captcha_mp3 {width:55px; height:55px; background-size:27px;}
	#captcha .wrap .captcha_icon_box button#captcha_reload {width:55px; height:55px; background-size:20px;}

	.file_btn_box_container .file_btn_box_con > div label.file_btn_box_label {background-size:18px; margin-left:7px;}
	.wirte_container_con_inner.contact_privacy .wirte_container .wirte_tit label br {display:none;}
}
@media all and (max-width:600px){
	.contact_txt_box .right_box {width:100%; margin-top:15px;}
}
@media all and (max-width:480px){
	/* 캡챠 */
	#captcha .wrap .captcha_icon_box {width:100%; margin-left:0; margin-top:5px;}
	#captcha #captcha_key.captcha_box {width:100%;}
}
@media all and (max-width:380px){
	.contact_txt_box .left_box strong br {display:none;}
	/* 캡챠 */
	#captcha .wrap .img_box #captcha_img {width:100%;}
}


/* 추가 */
input[type=file]:focus, input[type=radio]:focus, input[type=checkbox]:focus {outline:5px auto blue; outline-offset:1px;}
.wirte_container_con_inner.contact_privacy .wirte_container .wirte_content p input:focus + label {border:1px dotted #333;}
#captcha #captcha_key.captcha_box:focus {border-color: #66afe9; outline: 0; -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(102 175 233 / 60%);box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(102 175 233 / 60%);}
