@charset "utf-8";

*{margin:0;padding:0}
html{height:100%}
body{height:100%;width:100%;overflow-x:hidden;font-family:'DroidSansFallback', 'Apple Gothic', 'Malgun Gothic', '맑은 고딕', '돋움', Dotum, '굴림', Gulim, Helvetica, sans-serif;font-size:16px;color:#555;-webkit-text-size-adjust:none}
body, p, h1, h2, h3, h4, h5, h6, table, caption, form, fieldset, legend, span{margin:0;padding:0}
h1, h2, h3, h4, h5, h6{font-size:16px}
section, article, aside, hgroup, header, footer, nav, figure, figcaption, time, mark, canvas, video, audio, details, summary{display:block}
ul, ol, li, dl, dt, dd{list-style:none}
img{width:100%;border:0;line-height:0;font-size:0;vertical-align:top}
table{border-collapse:collapse;border-spacing:0;width:100%}
fieldset{border:0}
legend, caption{display:none;position:absolute;top:-1000em;left:0;overflow:hidden}
a{display:inline-block;color:#555;vertical-align:top}
a:link, a:visited{text-decoration:none}
a:hover, a:active, a:focus{text-decoration:none;outline:0}
textarea{border:1px solid #bbb;line-height:18px}
input, textarea{text-indent:5px}
select{font-size:15px;background:#fff url("/resources/mobile/img/common/bg_select.gif") no-repeat center right;background-size:9px 5px}
input[type=checkbox]{width:13px;height:13px;border:1px solid #cadbe5;border-radius:0}
input[type=radio]{}
button{position:relative;margin:0;padding:0;background:#fff;cursor:pointer;font-family:inherit;border:1px solid #bbb}
button *{margin:0;padding:0}
button::-moz-focus-inner{margin:0;padding:0}
em{font-style:normal}
iframe{border:0}
label{vertical-align:middle;color:#222}
address{font-style:normal}
.blind{display:block;position:absolute;clip:rect(0 0 0 0);width:1px;height:1px;margin:-1px;overflow:hidden}
.hide{display:none}
.disHide{display:none}
.ir{display:inline-block;position:absolute;top:0;left:0;width:100%;height:100%;background-size:100% 100%;background-repeat:no-repeat}

input[type='text'], input[type='password'], input[type='submit'], input[type='search']{-webkit-appearance:none;border-radius:0}
button, input[type='button'], input[type='submit'], input[type='reset'], input[type='file']{-webkit-appearance:button;border-radius:0}
input[type='text'], input[type='password'], input[type='tel'], input[type='number']{padding:0 0.5em;height:35px;border:1px solid #e3e3e3;border-radius:3px;box-sizing:border-box;font-size:1.154em}
input.intgray{border:1px solid #ccc; background:#ccc}

/*common*/
.fL{float:left}
.fR{float:right}
.agL{text-align:left !important}
.agC{text-align:center !important}
.agR{text-align:right !important}
.lts{letter-spacing:-0.5px}
.f11{font-size:11px !important}
.f12{font-size:12px !important}
.f18{font-size:18px !important}
.mg0{margin:0 !important}
.pd15{padding-top:15px !important}
.pdB55{padding-bottom:55px !important}
.bdBN{border-bottom:none !important}

.header{position:relative; padding:15px 0 17px; text-align:center; border-bottom:1px solid #ff954f; background:#ff8332}
.header h1{font-size:18px; font-weight:600; color:#fff}
.header .btnPre{display:block; position:absolute; top:20px; left:25px; width:9px; height:15px; text-indent:-1000px; background:url(/resources/mobile/img/met/btn_arrow.png) no-repeat 0 center; background-size:10px 16px}

.container{}
.contents{padding:30px 25px}

.topContent{padding:20px 0 20px 0; color:#fff; font-size:14px; text-align:center; background:#ff8332}
.topContent.confirm .img{padding:95px 0 20px 0; line-height:22px; background:url(/resources/mobile/img/met/icon_confirm.png) no-repeat center 15px; background-size:45px 59px}
.topContent.confirm .txt2 span{color:#fdfa05}
.topContent .info{padding-top:80px; line-height:22px; background:url(/resources/mobile/img/met/icon_info.png) no-repeat center 15px; background-size:55px 47px}

.topContent .insuranceInfo{position:relative; display:table; width:90%; margin:0 5%; padding:10px 0; color:#000; text-align:left; border-radius:10px; background:#fdecdb}
.topContent .insuranceInfo .boxL{display:table-cell; width:30%; min-height:40px; font-size:13px; font-weight:600; text-align:center; letter-spacing:-0.5px; border-right:1px solid #ff8332}
.topContent .insuranceInfo .boxL.male{padding-top:60px; background:url(/resources/mobile/img/met/ico_male_s.png) no-repeat center 0; background-size:57px 57px}
.topContent .insuranceInfo .boxL.female{padding-top:60px; background:url(/resources/mobile/img/met/ico_female_s.png) no-repeat center 0; background-size:57px 57px}
.topContent .insuranceInfo .boxL.imgT{padding-top:70px; background-position:center 10px}
.topContent .insuranceInfo .boxL.memo{padding-top:70px; background:url(/resources/mobile/img/met/ico_memo.png) no-repeat center center; background-size:60px 61px}
.topContent .insuranceInfo .txt{display:table-cell; width:68%; padding-left:5%; vertical-align:middle; line-height:22px}
.topContent .insuranceInfo .txt span{color:#dd543c}
.topContent .insuranceInfo:after{content:"."; display:block ;height:0; clear:both; visibility:hidden}

.productList h2{padding: 0 28px 5px 0; font-size:20px; font-weight:bold; color:#333}
.productList p span{color:#f15a48}
.productList li{position:relative; padding:0 0 30px 0; margin-top:20px; border-bottom:1px solid #f4f4f4}
.productList li:last-child{padding-bottom:0; border-bottom:none}
.productList .conList a{float:left; display:inline-block; width:48%; margin-right:4%; margin-top:10px; padding:65px 0 10px; font-size:13px; text-align:center; border:1px solid #e8e8e8; border-radius:5px; box-sizing:border-box}
.productList .conList a:first-child{background:#fafafa url(/resources/mobile/img/met/img_item5.png) no-repeat center 15px; background-size:33px 38px}
.productList .conList a:last-child{margin-right:0; background:#fafafa url(/resources/mobile/img/met/img_item6.png) no-repeat center 15px; background-size:30px 39px}
.productList .conList:after{content:"."; display:block ;height:0; clear:both; visibility:hidden}
.productList .badge{position:absolute; top:3px; right:0; display:block; width:29px; height:31px; text-align:center; padding-top:9px; font-weight:700; color:#fff; font-size:9px; background:no-repeat center; background-size:29px 31px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box}
.productList .badge.best{background-image:url(/resources/mobile/img/met/bg_icon_or.gif)}
.productList .badge.new{background-image:url(/resources/mobile/img/met/bg_icon_y.gif)}

.productView{position:relative; margin-bottom:40px; border-bottom:1px solid #f4f4f4}
.contents .productView:last-child{margin-bottom:0; border-bottom:none}
.productView h2{padding-left:28px; color:#333; font-size:22px; vertical-align:middle}
.productView h2.img1{background:url(/resources/mobile/img/met/img_01.png) no-repeat 0 5px; background-size:20px 25px}
.productView h2.img2{background:url(/resources/mobile/img/met/img_02.png) no-repeat 0 7px; background-size:22px 20px}
.productView h2.img3{background:url(/resources/mobile/img/met/img_03.png) no-repeat 0 6px; background-size:20px 21px}
.productView h2.img4{background:url(/resources/mobile/img/met/img_04.png) no-repeat 0 7px; background-size:21px 18px}
.productView .unit{position:absolute; top:3px; right:0; font-size:12px; letter-spacing:-1px}
.productView ul{padding-bottom:35px}
.productView li h3{padding:20px 0 15px 0; font-size:14px}
.productView .barGrp{position:relative; width:100%; height:21px; border-radius:10px; background:#f3f3f3}
.productView .barGrp .bar{position:absolute; top:0; left:0; min-height:20px; padding-bottom:1px; color:#fff; font-size:14px; font-weight:600; text-align:right; border-radius:10px; vertical-align:middle; z-index:1}
.productView .barGrp .bar.black{padding-top:2px; padding-bottom:0; min-height:19px; font-size:11px; text-align:left; background-color:#404347; z-index:2}
.productView .barGrp .bar.orange{background-color:#ff751c}
.productView .barGrp .bar.blue{background-color:#5fcbbb}
.productView .barGrp .bar.purple{background-color:#5d6cb5}
.productView .barGrp .bar.pink{background-color:#ff8681}
.productView .barGrp .bar .txt{padding-left:10px}
.productView .barGrp .bar .num{padding-right:10px}
.productView .avr{width:100%}
.productView .avr p{display:inline-block; padding-top:10px; font-size:13px; color:#595959; text-align:right}
.productView .avr .arrow{padding-top:10px; background:url(/resources/mobile/img/met/img_arrow.png) no-repeat right top; background-size:10px 8px}

.sns{padding:28px 0 30px; text-align:center; border-top:10px solid #f4f4f4}
.sns p{font-size:13px; margin:0 0 18px 0}
.snsList a{display:inline-block; width:40px; height:41px; margin:0 3px; text-indent:-1000px}
.snsList .mail{background:url(/resources/mobile/img/met/btn_mail.png) no-repeat; background-size:40px 41px}
.snsList .talk{background:url(/resources/mobile/img/met/btn_talk.png) no-repeat; background-size:40px 41px}
.snsList .sms{background:url(/resources/mobile/img/met/btn_sms.png) no-repeat; background-size:40px 41px}

.age{padding:0 0 30px 20px; border-bottom:1px solid #e7e7e7}
.age .txt{padding:0 0 10px}
.age span{color:#acacac; letter-spacing:-1px}

.container .muList{padding:0 0 0 2%; border-bottom:1px solid #e4e0dd; background:#fdf8f4}
.container .muList li{float:left; width:35%; text-align:center; font-size:15px; letter-spacing:-1px}
.container .muList a{padding:10px 0}
.container .muList a.on{ color:#ff751c; font-weight:600; border-bottom:3px solid #ff751c}
.container .muList li:nth-of-type(2){width:27%}
.container .muList:after{content:"."; display:block ;height:0; clear:both; visibility:hidden}

.contents .info{padding:0}
.contents .info .allNum{padding:14px 0 18px 15px; margin-bottom:18px; font-size:14px; background:#f8f8f8}
.contents .info .allNum span{font-size:18px; color:#ea5539}
.contents .list{width:100%; margin-bottom:20px}
.contents .list li{display:inline-table; padding:25px 0 27px 0; border-bottom:1px solid #f4f4f4; letter-spacing:-0.5px}
.contents .list li:first-child{padding-top:10px}
.contents .list li .txt1{position:relative; display:table-cell; width:55%; vertical-align:middle}
.contents .list li .txt2{display:table-cell; width:45%; color:#2b2b2b; text-align:right; vertical-align:middle}
.contents .list li .txt1 p, .contents .list li .txt2 span{display:table-cell; vertical-align:middle}
.contents .list .txt1 .circle{display:block; width:35px; height:31px; margin-top:5px; padding-top:3px; color:#fff; text-align:center; font-size:10px; line-height:12px; border-radius:50%; background:#f15b47}
.contents .list .txt1 .insTxt{display:table-cell; padding-left:5px; vertical-align:middle}
.contents .list .txt1 .date{display:block; font-size:12px; color:#999; letter-spacing:0}
.contents .list.total{padding:20px 0 5px; font-weight:bold; border-top:1px solid #aaa}
.contents .list li:after{content:"."; display:block ;height:0; clear:both; visibility:hidden}

.contents .conTxt{ text-align:center; padding:15px 0 25px}
.contents .prdTxt{padding:0 0 20px; font-size:14px; text-align:center}
.contents .prdTxt p:first-child{padding:15px 0 75px; font-size:18px; color:#2b2b2b; background:url(/resources/mobile/img/met/ico_memo2.png) no-repeat center 53px; background-size:50px 50px}
.contents .prdTxt span{color:#ad5f8e}

.assList{border-bottom:1px solid #e7e7e7}
.assList li{padding:0 0 25px 0}
.assList .txt{display:inline-block; padding-left:3%; width:20%; vertical-align:top}
.assList .txt:first-child{padding-bottom:30px}
.assList .genderChk{display:inline-block; width:70%}
.assList .genderChk label{display:inline-block; width:76px; height:76px; vertical-align: middle; cursor:pointer; text-indent:-1000px}
.assList .genderChk input[type=radio]{width:20px; height:20px; margin-top:10px}
.assList .genderChk span{display:inline-block; text-align:center}
.assList .genderChk .male{margin-right:30px}
.assList .genderChk .male label{background:url(/resources/mobile/img/met/ico_male.png) no-repeat; background-size: auto 100%}
.assList .genderChk .female label{background:url(/resources/mobile/img/met/ico_female.png) no-repeat; background-size:auto 100%}

.itemList a{font-size:20px; font-weight:bold; text-align:center}
.itemList li{display:inline-block; float:left; width:48%; height:80px; margin-right:4%; margin-bottom:12px; padding:90px 0 0 0; font-size:20px; font-weight:bold; text-align:center; border-radius:7px}
.itemList li:nth-of-type(2),.itemList li:nth-of-type(4){margin-right:0}
.itemList .item1{color:#5aa5bc; background:#deedf2 url(/resources/mobile/img/met/img_item1.png) no-repeat center 25px; background-size:40px 55px}
.itemList .item2{color:#f47321; background:#fde3d3 url(/resources/mobile/img/met/img_item2.png) no-repeat center 20px; background-size:38px 60px}
.itemList .item3{color:#f15a48; background:#fcdeda url(/resources/mobile/img/met/img_item3.png) no-repeat center 20px; background-size:38px 60px}
.itemList .item4{color:#ad5f8e; background:#efdfe8 url(/resources/mobile/img/met/img_item4.png) no-repeat center 24px; background-size:50px 56px}
.itemList .item1 a{color:#5aa5bc}
.itemList .item2 a{color:#f47321}
.itemList .item3 a{color:#f15a48}
.itemList .item4 a{color:#ad5f8e}
.itemList .txt2{padding-top:7px; font-size:11px; color:#8e8d8d; letter-spacing:-1px; font-weight:normal}
.itemList ul:after{content:"."; display:block ;height:0; clear:both; visibility:hidden}


/*버튼*/
.btnLine{padding:30px 0}
.btn{display:inline-block; width:100%; min-height:35px; padding:8px 12px; text-align:center; border:0; border-radius:3px; box-sizing:border-box; -webkit-box-sizing: border-box;-moz-box-sizing:border-box; vertical-align:middle}
.btn.red{padding:13px 0 17px; border-radius:50px; color:#fff; background:#ea5539}
.btnBottom a{float:left; display:inline-block; width:50%; padding:15px 0 19px 0; font-size:14px; color:#fff; text-align:center; box-sizing:border-box; -webkit-box-sizing: border-box;-moz-box-sizing:border-box; background:#937b6e}
.btnBottom.w100 a{float:none; width:100%}
.btnBottom a:first-child{ border-right:1px solid #b4a39a}
.btnBottom a span{display:inline-block}
.btnBottom .hum span{padding:0 0 3px 24px; background:#937b6e url(/resources/mobile/img/met/img_human.png) left center no-repeat; background-size:16px 19px}
.btnBottom .tel span{padding:0 0 3px 26px; background:#937b6e url(/resources/mobile/img/met/img_tel.png) left 3px no-repeat; background-size:18px 18px}
.btnBottom .info{width:100%; border-top:1px solid #b4a39a}
.btnBottom .info span{padding:0 0 3px 26px; background:#937b6e url(/resources/mobile/img/met/img_info.png) left 1px no-repeat; background-size:17px 20px}
.btnBottom.fixed{ width:100%; position:fixed; bottom:0}