@charset "utf-8";

/* ----------------------------------------------------------
	# 한화손해보험
	# 공통컨텐츠 CSS
---------------------------------------------------------- */
/* 디스플레이 설정 */
.hidden, .hd {position:absolute !important;overflow:hidden !important;width:0 !important;height:0 !important;font-size:0 !important;text-indent:-999em;}
.none {display:none;}

/* 색상, 사이즈 */
.txt_c1 {color:#f36910 !important;}
.txt_c2 {color:#e20000 !important;}
.txt_small {font-size:12px;color:#555;}

/*a[href*="tel"] {font-weight:bold;}*/

/* ---------------------------------------------------------
	CONTENT 공통 :타이틀 및 텍스트/문구
--------------------------------------------------------- */
/* 타이틀타입1 */
.tit_type1 {position:relative;margin:2.4rem 0 0.8rem;}
.tit_type1 h2, .tit_type1 h3 {margin:0 11rem 0 0;font-size:1.9rem;line-height:2.4rem;}
.tit_type1 h2:only-child, .tit_type1 h3:only-child {margin:0;}
.tit_type1 .sub {position:absolute;right:0;top:0;}
.mes_area + .section > .tit_type1 {margin-top:0.4rem;}

/* 서브타이틀1 */
.tit_sub1 {position:relative;margin:2.4rem 0 0.8rem;}
.tit_sub1 h2, .tit_sub1 h3 {margin:0 10rem 0 0;line-height: 2.0rem;}
.tit_sub1:not(div), div.tit_sub1 > h2, div.tit_sub1 > h3 {font-size:1.6rem;line-height:2.2rem;padding:0.3rem 0;}
.tit_sub1 p:not(.sub) {margin:0.2rem 0 0;}
.tit_sub1 > .sub {position:absolute;right:0;top:0;margin:0;}
.tit_sub1 > .sub.txt_icon1 {bottom:0.4rem;}
.tit_sub1 + p {margin:-0.1rem 0 1.2rem;}
.tit_sub1 + fieldset > .con_toggle1.agree {margin:0;}
.tit_sub1.center {text-align:center;}
h2.tit_sub1 > span, h3.tit_sub1 span {font-weight:normal;color:#666;}
p.tit_sub1 {font-weight:normal;line-height:2.2rem;}
.section > .tit_sub1:first-child {margin-top:0.4rem;}

/* 텍스트유형1 : 도트 */
.txt_type1 > li, .txt_type1 > dd, .txt_type1:not(ul):not(ol):not(dl) {position:relative;padding:0 0 0 0.7rem;;}
.txt_type1 > li:before , .txt_type1 > dd:before , .txt_type1:not(ul):not(ol):not(dl):before {position:absolute;left:0;top:0.7rem;content:'';width:0.3rem;height:0.3rem;background:#555;border-radius:50%;}
.txt_type1 > li + li, .txt_type1 > dd {margin:0.428em 0 0;}
.txt_type1 > dt {margin:0 0 0.4rem;font-weight:bold;}
.txt_type1 ul li {position:relative;padding:0 0 0 0.7rem;font-size:1.1rem;color:#666}
.txt_type1 ul li:before {content:'';position:absolute;left:0;top:0.7em;width:0.4rem;height:1px;background:#666;}
.txt_type1 .tel {display:block;font-size:1.8rem;font-weight:bold;color:#f36910;}
.txt_type1.small > li:before , .txt_type1.small > dd:before , .txt_type1.small:not(ul):not(ol):not(dl):before {top:0.8rem;content:'';width:0.2rem;height:0.2rem;}
fieldset + .txt_type1, fieldset + .txt_type3 {margin-top:1.2rem;font-size:1.2rem !important;}
p + .txt_type1 {padding-top:0.5rem;}
.box_info + .txt_type1 {margin-top:2.5rem;}
.txt_type1 + .txt_type1 {margin-top:1.0rem;}
.list_con2 + .txt_type1 {margin-top:1.0rem;}

/* 텍스트유형3 : 별표 */
.txt_type3 > li, .txt_type3 > dd, .txt_type3:not(ul):not(ol):not(dl) {position:relative;padding:0 0 0 0.8rem;font-size:1.1rem;opacity:0.8;}
.txt_type3 > li:before , .txt_type3 > dd:before , .txt_type3:not(ul):not(ol):not(dl):before {display:inline-block;width:0.8rem;margin:0.5em 0 0 -0.8rem;content:'*';line-height:1.0em;vertical-align:top;text-align:left;}
.con_toggle1 + .txt_type3, .form_telnum + .txt_type3 {margin-top:1rem;}
p + .txt_type3 {padding-top:0.6rem;}

/* 텍스트유형 : 공통  */
em.txt_type1, em.txt_type2, em.txt_type3 {display:inline-block;}


/* ---------------------------------------------------------
	CONTENT 공통 : 문구유형
--------------------------------------------------------- */
/* 문구 : 폼validation */
.mes_validate {position:relative;margin:0.4rem 0 0 0;padding:0 0 0 1.5rem;color:#29952b;text-align:left;}
.mes_validate:before, .mes_validate:after {content:'';position:absolute;left:0;top:0.4rem;display:block;}
.mes_validate:before {width:1.2rem;height:1.2rem;background:#29952b;border-radius:50%;}
.mes_validate:after {width:0.5rem;height:0.3rem;margin:0.3rem 0 0 0.3rem;border-left:0.1rem solid #fff;border-bottom:0.1rem solid #fff;-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);transform:rotate(-45deg);}
.mes_validate.error {color:#e20000;}
.mes_validate.error:before {background-color:#e20000;}

/* 문구 :데이터없음 */
.mes_nodata {padding:5.6rem 1.5rem;text-align:center;}
.mes_nodata > p > strong:first-child {display:block;margin:0 0 1.3rem;font-size:1.4rem;line-height:2.2rem;font-weight:normal;}
.mes_nodata > p > strong:first-child > span {font-weight:bold;}
.mes_nodata > p > strong:first-child > span ~ span {color:#f36910;}

/* ---------------------------------------------------------
	CONTENT 공통 : 버튼
--------------------------------------------------------- */
/* 버튼 :공통 */
.btn_com, .btn_sub1, .btn_sub2 {position:relative;display:inline-block;border:1px solid #bbb;background:#fff;color:#111;text-align:center;text-decoration:none;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
.btn_com:focus, .btn_sub1:focus, .btn_sub2:focus {text-decoration:none;}

/* 버튼 :액션버튼 */
.btn_com {padding:0 2.5rem;font-size:1.4rem;line-height:4.2rem;border-radius:0.3rem;}
.btn_com.more:after, .btn_com.tel:before, .btn_com.arrow:after {content:'';display:inline-block;vertical-align:middle;background:url(../images/com/icon_com.png) 0 -8.0rem no-repeat;background-size:40rem 40rem;}
.btn_com.more:after {width:1.0rem;height:1.0rem;margin:-0.3rem 0 0 0.4rem;background-position:0 -8.0rem;}
.btn_com.tel:before {width:1.3rem;height:1.4rem;margin:0 0.8rem 0 0;line-height:1;background-position:0 -5.4rem;}
.btn_com.arrow:after {width:1.4rem;height:2.2rem;margin:0.8rem 0 0 0.4rem;background-position:0 -27.0rem;}

.btn_com > span {display:inline-block;max-width:99%;font-size:1.2rem;line-height:1.8rem;vertical-align:middle;letter-spacing:-1px;}

/* 버튼타입 */
.btn_sub2 {padding:0 1.2rem;font-size:1.2rem;line-height:2.6rem;border-radius:0.2rem;}
.btn_sub2.arr:after {content:'';display:inline-block;width:6px;height:20px;margin:0 0 0 4px;vertical-align:middle;}

/* 버튼 :사이즈 */
button.btn_com {height:4.5rem;}
button.btn_sub1 {height:3.8rem;}
button.btn_sub2 {height:2.8rem;}

/* ---------------------------------------------------------
	CONTENT 공통 : 폼요소
--------------------------------------------------------- */
/* 폼객체 :공통 */
input.text, textarea.textarea, .select_box, span.text {display:inline-block;padding:0.8rem 1.0rem;border:1px solid #dedede;font-size:1.4rem;line-height:2.0rem;color:#444;border-radius:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
input.text, .select_box {height:3.8rem;}
input.text[disabled="disabled"], .select_box[disabled="disabled"] {background:#f4f4f4;border-color:#ededed;color:#a5a5a5;}
input.text[readonly="readonly"] {background:#f4f4f4;border-color:#ededed;}
input.text:focus, input.text.focus, .select_box:focus, textarea.textarea:focus {border-color:#f36910;}
input.text.error, .select_box.error {border-color:#e20000;}
input.text.price {text-align:right;}

::-webkit-input-placeholder {font-size:1.4rem;line-height:2.0rem;color:#a5a5a5;font-weight:normal;}
:-moz-placeholder {font-size:1.4rem;line-height:2.0rem;color:#a5a5a5;font-weight:normal;}
::-moz-placeholder {font-size:1.4rem;line-height:2.0rem;color:#a5a5a5;font-weight:normal;}
:-ms-input-placeholder {font-size:1.4rem;line-height:2.0rem;color:#a5a5a5;font-weight:normal;}

/* 폼객체 :입력필드 */
textarea.textarea {width:100%;display:block;}

/* 폼객체 :셀렉트박스 */
.select_box {height:3.8rem;padding-right:3.0rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:url(../images/com/icon_com.png) 100% 100% no-repeat;background-size:40rem 40rem;}
.select_box {outline:0;padding-right:3.2rem;}
.select_box::-ms-expand {display:none;}

/* ---------------------------------------------------------
	CONTENT 공통 :폼양식
--------------------------------------------------------- */
/* 검색폼 */
.form_search3 {text-align:right;}

/* 폼유형 */
.form_area1 > div + div, .form_area > div + div {margin:1.5rem 0 0;}
.form_area1 > div > input[type="text"], .form_area1 > div > input[type="tel"], .form_area1  > div > select {width:100%;}
.form_area1 > div.info_data2 + div {margin-top:-0.1rem;}
.form_area1 span.text {display:block;background:#f4f4f4;color:#a5a5a5;}
.form_area1 span.text.valueon {color:#111;}
p + .form_area1 {margin:1.0rem 0;}


