@import url("./health01-program-tabs.css?v=20260829-5");

/*준비중*/
.ready{ text-align: center; padding-top: 100px;}
.ready .dong{ display: flex; justify-content: center; align-items: center;}
.ready .dong span{ display: block; width: 12px; height: 12px; border-radius: 50%; background-color: #ddd; margin: 0 7px;}
.ready h1{ font-size: 28px; font-weight: normal; font-weight: 500; color: #333; margin: 50px 0 10px 0;}
.ready h1 > strong{ color: #D1A280;}
.ready p{ font-size: 16px; font-weight: 300; color: #999; }

/*테이블 - 가로스크롤*/
.row-horizon { position:relative; width:100%; overflow-x: hidden; overflow-y: hidden;}
.tbl_blur{ display: none;}
.tbl_scroll{ display: none;}
/*테이블*/
.tbl table{ width:100%; border-left: 1px solid #ddd; text-align:center; font-size: 20px; border-spacing: 0; border-collapse : collapse;}
.tbl caption{ font-size: 0px; height: 0px;}
.tbl thead tr th{ padding:15px 10px; border-top:2px solid #444; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; background-color: #2CA5DA; color: #fff;}
.tbl tbody tr th{ padding:20px 10px; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; background-color: #eff5f8;}
.tbl tbody tr td{ padding:20px 10px; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; color: #666;}
.tbl2 tbody tr td{ padding:20px 20px; text-align:left;}
.tbl .p{ color: #999; margin-top: 20px; line-height: 1.5;}
.tbl_bi tbody tr th{ text-align: left; padding:20px 25px; background-color: transparent;}
.tbl_bi tbody tr td{ text-align: left; padding:20px 25px;}

@media screen and (max-width: 1023px) {
  .ready{ font-size:1.5rem; }
  .ready p{ font-size: 15px;}
  .img2 img{ width:100%;}
  .table_wrap{ position: relative;}
  .tbl_blur{ display: block; position:absolute; top:0px; right:0; width:40px; height:100%; background:url(../img/common/tbl_blur.png) repeat-y right top; z-index:10;}
  .row-horizon {overflow-x: scroll;overflow-y: hidden;white-space: nowrap;float: none; width: 100%;}
  .tbl_scroll{ display: block; font-size:12px; line-height: 12px; color:#888; margin-bottom:10px; padding-left: 5px;}
  .tbl table{ font-size: 16px;}
  .tbl thead tr th{ padding:15px 10px;}
  .tbl tbody tr th{ padding:15px 10px;}
  .tbl tbody tr td{ padding:15px 10px;}
  .tbl_bi tbody tr th{ padding:15px 20px;}
  .tbl_bi tbody tr td{ padding:15px 20px;}
}
@media screen and (max-width: 767px) {
  .tbl thead tr th{ padding:12px 5px;}
  .tbl tbody tr th{ padding:12px 5px;}
  .tbl tbody tr td{ padding:12px 5px;}
  .tbl_bi tbody tr th{ padding:12px 20px;}
  .tbl_bi tbody tr td{ padding:12px 20px;}
}

/*************** 서브 상단비주얼 ***************/
.svisual{ width:100%; height:400px; position: relative;
background: #0A2642;
background: -webkit-linear-gradient(90deg, rgba(10, 38, 66, 1) 0%, rgba(28, 75, 140, 1) 100%);
background: -moz-linear-gradient(90deg, rgba(10, 38, 66, 1) 0%, rgba(28, 75, 140, 1) 100%);
background: linear-gradient(90deg, rgba(10, 38, 66, 1) 0%, rgba(28, 75, 140, 1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0A2642", endColorstr="#1C4B8C", GradientType=1);}
.sv01{ background-image: url(../img/sub/svisual01_01.jpg); background-position: center top; background-repeat: no-repeat; background-size: cover;}
.svisual::after{ display: block; content: ""; width:413px ; height: 463px; background: url(../img/main/cont04_logo.png) no-repeat center center; opacity: .7; 
  position: absolute; bottom: 0px; right: 5%;}
.svg_tit{ position: absolute; top:180px; left: 50%; transform: translateX(-50%); text-align: center;}
.svg_tit h1{ font-size: 55px; font-weight: 500; letter-spacing: -1px; color:#fff; margin: 30px 0 20px 0;}
.svg_tit p{ font-size: 19px; font-weight: 300; color: rgba(255,255,255,.6);}
.loca ul{ display: flex; justify-content: center; align-items: center;}
.loca li{ padding: 0 17px; position: relative; font-size: 16px; font-weight: 300; color: rgba(255,255,255,.9); line-height: 14px;}
.loca li a{ line-height: 16px;}
.loca li::after{ display: block; content: ""; width: 4px; height: 4px; border-radius: 50%; background-color: #fff; position: absolute; top: 50%; right: -2px; 
transform: translateY(-50%);}
.loca li:last-child::after{ display: none;}
.loca li:last-child { color: #1cc7df; font-weight: 600;}

.svisual .sv_tit{ position: absolute; top: 280px; left: 50%;}
.svisual .sv_tit h3{ font-family: "Noto Serif KR", serif; font-size: 18px; font-weight: 900; letter-spacing: 2px; color: #E4BC9F;}
.svisual .sv_tit h2{ font-size: 25px; font-weight: 400; color: #fff; margin: 70px 0 20px 0;}
.svisual .sv_tit h1{ font-family: "Noto Serif KR", serif; font-size: 55px; font-weight: 500; letter-spacing: -2px; color:#fff;}
.svisual .sv_tit .fat_h1{ margin-top: 50px;}
.svisual .sv_tit p{ font-size: 19px; font-weight: 300; color:rgba(255,255,255,.7); margin-top:30px;}

@media screen and (max-width: 1023px) {
  .svisual{ height:280px;}
  .svisual::after{ right: -2%;}
  .svg_tit{ top:120px; width: 100%;}
  .svg_tit h1{ font-size: 40px; margin: 20px 0 20px 0;}
  .svg_tit p{ font-size: 16px;}
}
@media screen and (max-width:767px) {
  .svisual{ height:230px;}
  .svg_tit{ top:90px; width: 90%;}
  .svg_tit h1{ font-size: 35px; margin: 10px 0;}
  .svg_tit p{ font-size: 15px; line-height: 1.5; padding: 0 6%;}
  .loca li{ padding: 0 13px;font-size: 14px; line-height: 14px;}
  .loca li a{ line-height: 14px;}
  .loca li::after{ width: 3px; height: 3px; right: -1.5px; }
  .loca img{ width: 12px;}
}

/*************** 서브메뉴 ***************/
.smenu_box .smenu ul{ background-color: #0A2540; border-radius: 20px 0 20px 20px; width: 250px; padding: 20px 20px;}
.smenu_box .smenu ul li a{ display:block; font-size:16px; font-weight: 400; color:#eee; line-height:45px; padding: 0 15px; border-radius: 8px 0 8px 8px;
border-bottom: 1px dashed rgba(255,255,255,.1);}
.smenu_box .smenu ul li a:hover{ color: #222; font-weight: 500; background-color: #f4f4f4;}
.smenu_box .smenu ul li a.menu_on{ color:#fff; font-weight: 700; background-color: #0A9FDF; position: relative;}
.smenu_box .smenu ul li a.menu_on::after{ display: block; content: ""; width: 5px; height: 5px; border-radius: 50%; background-color: #fff;
position: absolute; top: 50%; right: 15px; transform: translateY(-50%);}
.mo_smenu{ display: none;} 
@media screen and (max-width: 1279px) {
  .smenu_box .smenu ul{ width: 200px; padding: 20px 10px;}
}
@media screen and (max-width: 1100px) {
  .smenu_box{ display: none;}
}

/*************** 내용작업 ***************/

/*인사말*/
.grt_img{ height: 250px; border-radius: 20px; overflow: hidden; background: url(../img/main/visual01.jpg) no-repeat center 100%; margin-bottom: 40px;}
.grt h1{ font-size: 40px; font-weight: normal; font-weight: 500; color: #333; line-height: 1.3; margin-bottom: 60px; padding: 0 1%;}
.grt h1 span{ display: block;}
.grt h1 strong{ color: #2CA5DA; font-weight: normal; font-weight: 700;}
.grt p{ font-size: 19px; font-weight: 300; line-height: 1.8; color: #333; padding: 0 1%;}
.grt h2{ font-size: 30px; font-weight: normal; font-weight: 700; color: #333; line-height: 1.5; text-align: right; margin-top: 50px; padding: 30px 1% 0 1%; 
  border-top: 1px solid #ddd;}
.grt h2 span{ display: block; font-weight: 300; font-size: 18px; color: #1C4E83;}
@media screen and (max-width: 1023px) {
  .grt_img{ height: 200px; margin-bottom: 30px;}
  .grt h1{ font-size: 30px; margin-bottom: 40px;}
  .grt p{ font-size: 16px;}
}
@media screen and (max-width: 767px) {
  .grt_img{ height: 150px; border-radius: 15px; margin-bottom: 20px; background-position: center 80%;}
  .grt h1{ font-size: 25px;}
  .grt h1 > br{ display: none;}
  .grt .nobr{ display: none;}
  .grt h2{ font-size: 20px; margin-top: 30px; padding: 20px 1% 0 1%;}
  .grt h2 span{ font-size: 14px; }
}
  
/*설립이념*/
.inum h1{ font-size: 40px; font-weight: normal; font-weight: 400px; text-align: center; line-height: 1.4; letter-spacing: -1px; margin-bottom: 120px; position: relative;}
.inum h1 span{ font-weight: 600; color: #2CA5DA;}
.inum h1::before{ display: block; content: ""; width: 1px; height: 70px; background-color: #2CA5DA; position: absolute; bottom: -80px; left: 50%;}
.inum h1::after{ display: block; content: ""; width: 8px; height: 8px; border-radius: 50%; background-color: #2CA5DA; position: absolute; bottom: -84px; left: 50%;
margin-left: -4px;}
.inum_box{ border-top: 1px solid #ddd;}
.inb{ border-bottom: 1px solid #ddd; padding: 50px 2%; display: flex; align-items: center; flex-wrap: wrap;}
.inum_box .inb:nth-of-type(odd){ background-color: #f7f7f7;}
.inb .num{ font-family: 'Paperozi'; font-size: 22px; color: #2CA5DA; flex: 2; text-align: center;}
.inb .num img{ display: block; margin: 0 auto; text-align: center;}
.inb dl{ flex: 8;}
.inb dt{ font-size: 30px; font-weight: 700; color: #333; margin-bottom: 20px;}
.inb dd{ font-size: 19px; font-weight: 300; line-height: 1.6; color: #666;}
.inum_bot{ width: 100%; height: 280px; border-radius: 20px; background: url(../img/main/visual02.jpg) no-repeat center 100%; margin-top: 60px; overflow: hidden; position: relative;}
.inum_bot::after{ display: block; content: ""; width: 100%; height: 100%; background-color: rgba(0,0,0,.3); position: absolute; top:0px; left: 0;}
.inum_bot .txt{ text-align: center; position: absolute; top:50%; left: 50%; transform: translate(-50%, -50%); z-index: 1; width: 100%;}
.inum_bot p{ font-size: 30px; color: #fff; font-weight: 700; line-height: 1.4; letter-spacing: -1px;}
.inum_bot h2{ margin-bottom: 20px;}
.inum_bot img{ width: 150px;}
@media screen and (max-width: 1023px) {
  .inum h1{ font-size: 30px;}
  .inb{ padding: 40px 2%;}
  .inb .num{ font-size: 20px;}
  .inb dt{ font-size: 25px;}
  .inb dd{ font-size: 16px;}
  .inum_bot{ height: 220px;}
  .inum_bot p{ font-size: 23px;}
}
@media screen and (max-width: 767px) {
  .inum h1{ font-size: 27px;}
  .inb{ padding: 30px 5%; display: block;}
  .inb .num{  font-size: 18px; flex: 1; margin-bottom: 20px;}
  .inb dl{ flex: 1;}
  .inb dt{ font-size: 23px;}
  .inb dd{ font-size: 15px;}
  .inum_bot{ height: 200px; margin-top: 20px; border-radius: 10px; }
  .inum_bot .txt{ width: 90%;}
  .inum_bot p{ font-size: 20px;}
  .inum_bot p > br{ display: none;}
  .inum_bot img{ width: 120px;}
}

/*의료진소개*/
.gr_tit{ text-align: center; margin-bottom: 50px; font-size: 20px; line-height: 1.6;}
.doc_wrap{ display: flex; flex-wrap: wrap; }
.dc_line{ border-top: 1px solid #ddd; margin-top: 70px; padding-top: 70px;}
.doc_img{ width: 400px; margin-right: 70px; overflow: hidden; border-radius: 10px;}
.doc_img img{ width: 100%;}
.doc_box{ padding-top: 10px;}
.doc_box h2{ font-size: 20px; font-weight: 700; color: #2CA5DA; margin-bottom: 10px;}
.doc_box h1{ font-size: 40px; font-weight: normal; font-weight: 500; color: #333; margin-bottom: 30px;}
.doc_box h1 > span{ font-size: 25px; font-weight: 700; color: #999;}
.doc_box dl{ margin-bottom: 30px;}
.doc_box dl.dl { margin-bottom: 0px; padding-top:20px; border-top: 1px solid #ddd;}
.doc_box dd{ font-size: 19px; font-weight: 300; color: #666; padding: 7px 0 7px 10px; position: relative;}
.doc_box dd::before{ display: block; content: ""; width: 4px; height: 4px; border-radius: 50%; background-color: #2CA5DA; position: absolute; top: 13px; left: 0px;}
.doc_box dd > span{ display: inline-block; width: 120px; margin-right: 15px; font-weight: 700; color: #333;}
@media screen and (max-width: 1023px) {
  .doc_img{ width: 350px; margin: 0 auto 40px auto;}
  .doc_box{ width: 90%; margin: 0 auto;}
}
@media screen and (max-width:767px) {
  .gr_tit{ margin-bottom: 30px; font-size: 16px;}
  .dc_line{ margin-top: 30px; padding-top: 30px;}
  .doc_img{ width: 250px; margin: 0 auto 30px auto;}
  .doc_box h2{ font-size: 16px;}
  .doc_box h1{ font-size: 27px;}
  .doc_box h1 > span{ font-size: 16px;}
  .doc_box dd{ font-size: 16px; padding: 3px 0 3px 10px;}
  .doc_box dd::before{ top: 11px;}
  .doc_box dd > span{ width: 95px; margin-right: 10px;}
}

/*장비소개*/
.jang{ display: flex; gap: 30px; flex-wrap: wrap;}
.jabox{ width: 45%; border: 1px solid #ddd; background-color: #f4f4f4;}
.jimg{ background-color: #fff; text-align: center;}
.jimg img{ width: 100%; margin: 0 auto;}
.jinfo{ padding: 30px 30px;}
.jinfo h2{ font-size: 16px; font-weight: normal; font-weight: 800; color: #3592CE; letter-spacing: 1px; text-transform: uppercase;}
.jinfo h1{ font-size: 28px; font-weight: 700; line-height: 1.1; margin: 10px 0 20px 0;}
.jinfo p{ font-size: 17px; line-height: 1.6; color:#666;}
@media screen and (max-width: 1023px) {
  .jang{ gap: 20px;}
  .jabox{ width: 48%;}
  .jinfo{ padding: 30px 20px;}
  .jinfo h2{ font-size: 12px;}
  .jinfo h1{ font-size: 22px;}
  .jinfo p{ font-size: 14px;}
  .jinfo p > br{ display: none;}
} 
@media screen and (max-width: 767px) {
  .jang{ gap: 10px; justify-content: center;}
  .jabox{ width: 90%;}
} 

/*둘러보기*/
.in_box{ display:flex; justify-content: space-between; align-items: center; flex-wrap: wrap; margin-bottom: 50px;}
.inimg{ width: 500px; height: 350px; border-radius: 20px; overflow: hidden; display: flex; justify-content: center; align-items: center;}
.inimg img{ width: 100%;}
.intxt{ width: calc(100% - 500px); padding-left: 50px;}
.intxt dt{ font-size: 35px; font-weight: 700; line-height: 1.1; margin-bottom: 20px;}
.intxt span{ display: block; font-family: 'Paperozi'; font-size: 15px; color:#86cbe9; margin-bottom: 40px;}
.intxt dd{ font-size: 18px; color: #666; line-height: 1.6;}
.in_box:nth-of-type(odd){ flex-direction: row-reverse;}
.in_box:nth-of-type(odd) .intxt{ padding-left: 0; padding-right: 80px;}
@media screen and (max-width: 1023px) {
  .in_box{ display:block; width: 90%; margin: 0 auto 50px auto;}
  .inimg{ width: 100%; height: auto; margin-bottom: 20px;}
  .inimg img{ width: 100%;}
  .intxt{ width: 100%; padding-left: 0;}
  .intxt dt{ font-size: 28px; }
  .intxt span{ margin-bottom: 30px;}
  .intxt dd > br{ display: none;}
  .in_box:nth-of-type(odd) .intxt{ padding-right: 0;}
} 
@media screen and (max-width: 767px) {
  .inimg{ border-radius: 10px; }
  .intxt dt{ font-size: 25px;  margin-bottom: 10px;}
  .intxt dd{ font-size: 16px;}
} 

/*오시는길*/
.grt_map{ margin-bottom: 50px;}
.grt_map .wrap_map{ height: 400px !important;}
.grt_map .wrap_controllers{ display: none;}
.grt_map .cont{ display: none;}
.grt_add{ margin: 50px 0; text-align: center;}
.grt_add h2{ font-size: 18px; color: #2CA5DA; font-weight: 700; margin-bottom: 10px;}
.grt_add h1{ font-size: 26px; font-weight: normal; font-weight: 300; color: #333; line-height: 1.3;}

.tran_box{ margin-bottom: 50px;}
.tran_box .tr_tit{ font-size: 30px; font-weight: 700; border-bottom: 1px solid #333; padding-bottom: 20px; margin-bottom: 30px;}
.tran_box .trb ul{ display: flex; flex-wrap: wrap; gap: 20px;}
.tran_box .trb li{ width: 48.5%; display: flex; border: 1px solid #ddd; border-radius: 15px; padding: 30px 30px;}
.tran_box .trb .img{ width: 70px; height: 70px; border-radius: 50%; background-color: #e8f5fa; line-height: 70px; text-align: center;}
.tran_box .trb .img img{ width: 30px; filter: invert(24%) sepia(80%) saturate(1153%) hue-rotate(186deg) brightness(82%) contrast(87%);}
.tran_box .trb .txt{ width: calc(100% - 70px); padding-left: 20px;}
.tran_box .trb h1{ font-size: 25px;}
.tran_box .trb dl{ margin-top: 15px;}
.tran_box .trb dt{ font-size: 18px; color: #333; font-weight: 600; margin-bottom: 10px;}
.tran_box .trb dd{ display: inline-block; background-color: #f4f4f4; border: 1px solid #ddd; line-height: 28px; padding: 0 15px; border-radius: 50px;
font-size: 17px; font-weight: 700; color: #333; margin: 0 5px 5px 0;}
.tran_box .trb p{ font-size: 17px; color: #666; line-height: 1.5; margin-top: 20px;}

.grt_box{ display: flex; justify-content: space-between; flex-wrap: wrap; margin: 0 auto; gap: 20px;}
.grt_box .gb{ flex: 1; border: 1px solid #2CA5DA; padding: 50px 60px;}
.grt_box .gb h1{ font-size: 25px; color: #333;  margin-bottom: 30px;}
.grt_box .gb dl{ display: flex; align-items: center; font-size: 22px; font-weight: 300; color: #333; margin-bottom: 12px;}
.grt_box .gb dt{ flex: 3; font-weight: 600;}
.grt_box .gb dd{ flex: 7;}
.grt_box .gb dl:last-child{ margin-bottom: 0;}
.grt_box .gb dl:last-child dd{ font-size: 18px; font-weight: 600; color: #999;}
.grt_box .gb p{ color: #aaa; line-height: 1.5; margin-bottom: 20px;}
.grt_box .gb h2{ font-family: "Paperozi"; font-size: 40px; font-weight: 800; letter-spacing: 2px; color: #2CA5DA;}

@media screen and (max-width: 1023px) {
  .grt_map .wrap_map{ height: 300px !important;}
  .tran_box .trb ul{ display: block;}
  .tran_box .trb li{ width: 100%; margin-bottom: 10px;}
  .grt_box .gb{ padding: 30px 30px;}
}
@media screen and (max-width: 767px) {
  .grt_map{ margin-bottom: 30px;}
  .grt_map .wrap_map{ height: 200px !important;}
  .tran_box .tr_tit{ font-size: 22px;}
  .tran_box .trb li{ padding: 20px;}
  .tran_box .trb .img{ width: 50px; height: 50px; line-height: 50px;}
  .tran_box .trb .img img{ width: 20px;}
  .tran_box .trb .txt{ width: calc(100% - 50px); padding-left: 15px;}
  .tran_box .trb h1{ font-size: 18px;}
  .tran_box .trb dt{ font-size: 15px;}
  .tran_box .trb dd{ line-height: 26px; font-size: 14px; padding: 0 10px;}
  .tran_box .trb p{ font-size: 14px; margin-top: 10px;}
  .tran_box .trb p > br{ display: none;}
}

/*건강검진 - 공통*/
.suc_bot{ margin-bottom: 80px;}
.suc_bots{ margin-bottom: 40px;}
.sut_img{ width: 100%; height: 350px; border-radius: 30px; overflow: hidden; background-position: center 70%; background-repeat: no-repeat; background-size: cover;}
.sut_img01{ background-image: url(../img/sub/sub_test.jpg);}
.sut_img02{ background-image: url(../img/sub/sub_test.jpg);}
.sut_img03{ background-image: url(../img/sub/sub_test.jpg);}
.sut_img04{ background-image: url(../img/sub/sub_test.jpg);}
.sut_img05{ background-image: url(../img/sub/sub_test.jpg);}
.sut_img06{ background-image: url(../img/sub/sub_test.jpg);}
.sut_img07{ background-image: url(../img/sub/sub_test.jpg);}
.sut_img08{ background-image: url(../img/sub/sub_test.jpg);}
.sut_img09{ background-image: url(../img/sub/sub_test.jpg);}
.sut_img10{ background-image: url(../img/sub/sub_test.jpg);}
.sut_img11{ background-image: url(../img/sub/sub_test.jpg);}
.sut_img12{ background-image: url(../img/sub/sub_test.jpg);}
.suc_point { padding-top: 30px;}
.suc_point p{ font-size: 28px; font-weight: normal; font-weight: 400; text-align: center; line-height: 1.4; letter-spacing: -1px; position: relative;}
.suc_point p::before{ display: block; content: ""; width: 1px; height: 60px; background-color: #2CA5DA; position: absolute; top: -75px; left: 50%;}
.suc_point p::after{ display: block; content: ""; width: 8px; height: 8px; border-radius: 50%; background-color: #2CA5DA; position: absolute; top: -75px; left: 50%;
margin-left: -4px;}
.suc_ptit{ margin-top: 30px; text-align: center;}
.suc_ptit ul{ display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 10px;}
.suc_ptit li{ font-size: 18px; font-weight: 700; color: #3592CE; padding: 15px 40px; border-radius: 30px; background-color: #d1e7f3;}

.suc_txt > p{ font-size: 19px; color: #333; line-height: 1.6;}
.suc_tit{ background: url(../img/main/logo_tit.png) no-repeat left center;}
.suc_tit > h1{ font-size: 30px; font-weight: normal; font-weight: 700; color: #333; letter-spacing: -1.5px; margin-bottom: 25px; padding-left: 25px;}
.suc_tit_p{ font-size: 18px; color: #333; line-height: 1.5; margin-bottom: 20px;}
.suc_img{ text-align: center;}
.suc_tits{ margin-bottom: 20px;}
.suc_tits::before{ display: block; content: ""; width: 30px; height: 3px; background-color: #2CA5DA; border-radius: 10px; margin-bottom: 7px;}
.suc_tits > h1{ font-size: 25px; font-weight: normal; font-weight: 600; letter-spacing: -1.5px; color: #333;}
.suc_tits > p{ font-size: 17px; color: #666;margin-top: 10px;}
.suc_tits_p{ font-size: 17px; color: #999; line-height: 1.5; margin-top: 20px;}
.suc_box01{ display: flex; align-items: center; background-color: #eff5f8; border-radius:20px; padding: 50px 40px; overflow: hidden; }
.suc_box01 .ico{ width: 120px; height: 120px; border-radius: 50%; background-color: #fff; border: 1px solid #d1e7f3; text-align: center; line-height: 120px;}
.suc_box01 .ico img{ width: 50px; filter: invert(79%) sepia(44%) saturate(5611%) hue-rotate(166deg) brightness(89%) contrast(92%);}
.suc_box01 .txt{ width: calc(100% - 120px); padding-left: 40px;}
.suc_box01 .txt dt{ font-size: 30px; font-weight: 700; color: #3592CE; margin-bottom: 10px;}
.suc_box01 .txt dd{ font-size: 20px; color: #666; line-height: 1.6;}

.suc_box02{ display: flex; flex-wrap: wrap; border: 1px solid #ccc;}
.suc_box02 > div{ flex: 5; padding: 50px 40px;}
.suc_box02 > div:nth-of-type(2){ border-left: 1px solid #ddd; background-color: #eff5f8;}
.suc_box02 h1{ font-family: 'Paperozi'; font-size: 13px; color: #2CA5DA; text-transform: uppercase; margin-bottom: 40px;}
.suc_box02 dt{ font-size: 24px; font-weight: 700; color: #222; margin-bottom: 10px;}
.suc_box02 dd{ font-size: 16px; color: #777; line-height: 1.6;}

.suc_box03 > div{ display: flex; align-items: flex-start; flex-wrap: wrap; padding: 50px 0 50px 60px; position: relative; border-bottom: 1px dashed #ddd;}
.suc_box03 > div:nth-of-type(4){ border-bottom: 0;}
.suc_box03 > div::before{ display: block; content: ""; width: 1px; height: 100%; background-color: #b7dff0; position: absolute; top: 0px; left: 0px;}
.suc_box03 h1{ font-family: 'Paperozi'; font-size: 15px; color: #fff; text-transform: uppercase; position: relative; background-color: #2CA5DA; padding: 7px 12px;
border-radius: 30px; margin-right: 30px;}
.suc_box03 h1::before{ display: block; content: ""; width: 10px; height: 10px; border-radius: 50%; background-color: #2CA5DA; position: absolute; top: 50%;
  transform: translateY(-50%); left: -65px;}
.suc_box03 dl{ width: calc(100% - 150px);}
.suc_box03 dt{ font-size: 30px; font-weight: 700; color: #222; margin-bottom: 10px;}
.suc_box03 dd{ font-size: 18px; color: #777; line-height: 1.6;}

.suc_box03 .hl_btn{ position: absolute; top:50%; right: 0px; transform: translateY(-50%); z-index: 1; width: 190px;}
.suc_box03 .hl_btn a{ font-size: 17px; color: #222; text-align: center; padding: 15px 10px; border-radius: 50px; border: 1px solid #333; display: inline-block; width: 190px;
margin: 5px 0;}
.suc_box03 .hl_btn a.color{ background-color: #2CA5DA; border-color: #2CA5DA; color: #fff;}
.suc_box03 .hl_btn a:hover{ border-color: #2CA5DA; color: #2CA5DA; font-weight: 600;}
.suc_box03 .hl_btn a.color:hover{ color: #fff;}

.suc_box04{ display: flex; align-items: center; flex-wrap: wrap; margin-bottom: 40px;}
.suc_box04 h1{ flex: 1; font-size: 20px; color: #fff; background-color: #2CA5DA; margin-right: 40px; padding: 15px 10px; border-radius: 10px; text-align: center;}
.suc_box04 > div{ flex: 9; display: flex; flex-wrap: wrap; gap: 10px;}
.suc_box04 dl{ flex:5; padding: 40px 40px; background-color: #eff5f8; border-radius: 15px;}
.suc_box04 dt{ font-size: 15px; font-weight: 800; color: #fff; width: 30px; height: 30px; border-radius: 50%; line-height: 30px; text-align: center; 
  background-color: #2CA5DA; margin-bottom: 20px;}
.suc_box04 dd > strong{ display: block; margin-bottom: 10px; font-size: 26px; color: #222; line-height: 1;}
.suc_box04 dd{ font-size: 17px; color: #777; line-height: 1.6;}

.tabnav_hl{ border-bottom: 1px solid #ddd;}
.tabnav_hl li{display: inline-block; text-align:center;}
.tabnav_hl li a:before{ content:""; position:absolute; left:0; bottom: -3px; width:100%; height:3px; }
.tabnav_hl li a.active:before{background:#2CA5DA;}
.tabnav_hl li a{ position:relative; display:block; padding:0 20px; line-height:60px; font-size:20px;}
.tabnav_hl li a:hover{ color:#2CA5DA;}
.tabnav_hl li a.active{ font-weight: bold; color:#2CA5DA;}
.tabcontent_hl{ margin-top: 50px;}

.gong_box{ border: 1px solid #ccc; border-radius: 10px; padding: 40px 40px;}
.gtit{ margin-bottom: 30px; position: relative;}
.gtit::before{ display: block; content: ""; width: 7px; height: 7px; background-color: #2CA5DA; border-radius: 50%; position: absolute; top: 12px; left: -14px;}
.gtit > h1{ font-size: 25px; font-weight: normal; font-weight: 700; letter-spacing: -1.5px; color: #333; display: flex; align-items: center;}
.gtit > h1 > span{ display: inline-block; background-color: #EFF5F8; font-size: 17px; font-weight: 700; color: #2CA5DA; padding: 8px 15px; border-radius: 30px; margin-left: 10px;}
.gtit > p{ font-size: 17px; color: #666; line-height: 1.5; margin-top: 10px;}
.gtit2{ font-size: 20px; font-weight: normal; font-weight: 600; margin-bottom: 10px;}
.go_p{ font-size: 17px; color: #999; line-height: 1.5; margin-top: 20px;}
.gobox{ background-color: #EFF5F8; border-radius: 10px; padding: 30px 30px;}
.gobox dt{ font-size: 18px; font-weight: 700; margin-bottom: 10px;}
.gobox dd{ font-size: 16px; color: #666; line-height: 1.5; padding: 2px 0;}
.gobox ul{ display: flex; align-items: center; flex-wrap: wrap; gap: 25px;}
.gobox ul.go_ul{ margin-top: 20px; gap: 10px;}
.gobox ul.go_ul_mo{ display: none;}
.gobox ul.go_ul2{ gap: 10px;}
.gobox li{ background-color: #fff; border: 1px solid #2CA5DA; border-radius: 7px; font-size: 17px; font-weight: 700; line-height: 50px; padding: 0 20px;}
.gobox li.arr{ background-color: transparent; border: none; padding: 0; position: relative;}
.gobox li.arr .arrt{ font-size: 13px; color: #cf2231; background-color: #f5dee0; line-height: 23px; padding: 0 10px; border-radius: 30px; position: absolute;
top: -10px; left: 50%; transform: translateX(-50%);}
.gobox li.arr_up{ transform: rotate(-90deg);}
.gobox li.arr_up .arrt{ top: 15px; transform: translateX(0); transform: rotate(90deg); margin-left: 0px; width: 57px;}
.gobox li.col{ background-color: #2CA5DA; border-color: #2CA5DA; color: #fff;}
.gobox li.gry{ border-color: #ccc; color: #777;}


@media screen and (max-width: 1279px) {
  .suc_box03 .hl_btn{ position: relative; top:auto; right: auto; transform: translateY(0); margin-top: 20px; width: 100%; padding-left: 110px;}
  .suc_box03 .hl_btn a{ margin: 0 10px 0 0;}
}
@media screen and (max-width: 1023px) {
  .suc_bot{ margin-bottom: 60px;}
  .sut_img{ height: 250px; border-radius: 20px;}
  .suc_point p{ font-size: 22px;}
  .suc_ptit li{ font-size: 16px; padding: 15px 30px;}
  .suc_txt > p{ font-size: 17px;}
  .suc_tit > h1{ font-size: 25px;}
  .suc_tit_p{ font-size: 16px;}
  .suc_img img{ width: 80%;}
  .suc_box01{ border-radius: 20px; padding: 40px 30px; }
  .suc_box01 .ico{ width: 100px; height: 100px; line-height: 100px;}
  .suc_box01 .txt{ width: calc(100% - 100px); padding-left: 30px;}
  .suc_box01 .txt dt{ font-size: 22px;}
  .suc_box01 .txt dd{ font-size: 16px;}
  .suc_box02 > div{ padding: 40px 20px;}
  .suc_box02 h1{ margin-bottom: 30px;}
  .suc_box02 dt{ font-size: 22px;}
  .suc_box03 > div{ padding: 30px 0 30px 40px;}
  .suc_box03 h1::before{ left: -45px;}
  .suc_box03 dt{ font-size: 25px;}
  .suc_box03 dd{ font-size: 16px;}
  .suc_box03 .hl_btn a{ font-size: 15px; padding: 13px 0; width: 160px; margin: 0 5px 0 0; }
  .suc_box04{ align-items: flex-start;}
  .suc_box04 h1{ font-size: 18px; margin-right: 20px;}
  .suc_box04 dl{ flex: none; width: 100%; flex-direction: column; padding: 30px 30px;}
  .tabnav_hl li a{ line-height:55px; font-size:18px;}
}
@media screen and (max-width: 767px) {
  .suc_bot{ margin-bottom: 50px;}
  .suc_bots{ margin-bottom: 25px;}
  .sut_img{ height: 200px;}
  .suc_point{ padding: 50px 2% 0 2%;}
  .suc_point p{ font-size: 20px;}
  .suc_ptit { margin-top: 20px;}
  .suc_ptit li{padding: 13px 25px;}
  .suc_txt > p{ font-size: 16px;}
  .suc_tit > h1{ font-size: 25px; }
  .suc_tits > h1{ font-size: 22px; }
  .suc_img img{ width: 100%;}
  .suc_box01{ display: block; padding: 30px 30px; }
  .suc_box01 .ico{ margin: 0 auto 30px auto;}
  .suc_box01 .txt{ width: 100%; padding-left: 0;}
  .suc_box01 .txt dt{ text-align: center; margin-bottom: 15px;}
  .suc_box02{ display: block;}
  .suc_box02 > div{ flex: none; padding: 40px 30px;}
  .suc_box02 > div:nth-of-type(2){ border-left: 0; border-top: 1px solid #ddd;}
  .suc_box02 dl{ width: 100%;}
  .suc_box03{ border: 1px solid #ccc;}
  .suc_box03 > div{ padding: 30px 8%; display: block;}
  .suc_box03 > div::before{ display: none;}
  .suc_box03 h1 {font-size: 12px; margin-right: 0; margin-bottom: 20px; display: inline-block;}
  .suc_box03 h1::before{ display: none;}
  .suc_box03 dl{ width: 100%;}
  .suc_box03 .hl_btn{ padding-left: 0; width: 100%;}
  .suc_box03 .hl_btn a{ width: 100%; margin: 0 0 5px 0; }
  .suc_box04{ display: block; margin-bottom: 30px;}
  .suc_box04 h1{ flex: none; width: 100%; margin-right: 0; margin-bottom: 10px; padding: 13px 10px;}
  .suc_box04 > div{ flex: none; width: 100%;}
  .suc_box04 dl{ padding: 30px;}
  .suc_box04 dt{ font-size: 13px; width: 25px; height: 25px; line-height: 25px;}
  .suc_box04 dd > strong{ font-size: 20px;}
  .tabnav_hl{ border: 0; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 5px;}
  .tabnav_hl li { width: 49%;}
  .tabnav_hl li a{ line-height:50px; padding: 0 10px; border: 1px solid #ccc;}
  .tabnav_hl li a::before{ display: none;}
  .tabnav_hl li a.active{ border-color: #2CA5DA;}

.gong_box{ padding: 30px 20px;}
.gtit::before{ width: 5px; height: 5px; top: 12px; left: -10px;}
.gtit > h1{ font-size: 23px;}
.gtit > h1 > span{ font-size: 14px; margin-left: 5px;}
.gobox{ padding: 20px 20px;}
.gobox dt{ font-size: 16px;}
.gobox ul{ gap: 10px;}
.gobox ul.go_ul{ display: none;}
.gobox ul.go_ul_mo{ display: flex; margin-top: 20px; gap: 10px;}
.gobox li{ font-size: 14px; line-height: 40px; padding: 0 10px;}
.gobox li.arr .arrt{ font-size: 12px; line-height: 22px; padding: 0 5px;}
.gobox li.arr_up{ transform: rotate(-90deg);}
.gobox li.arr_up .arrt{ top: 15px; transform: translateX(0); transform: rotate(90deg); margin-left: 0px; width: 57px;}
.gobox li.col{ background-color: #2CA5DA; border-color: #2CA5DA; color: #fff;}
.gobox li.gry{ border-color: #ccc; color: #777;}
.gobox ul.go_ul_mo li.arr_up{ transform: rotate(0);}
.gobox ul.go_ul_mo li.arr_up .arrt{ top: -10px; transform: rotate(0); margin-left: -22px; width: 45px;}


}

/*예약 및 결과*/

/* Buttons */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 12px 24px; border-radius: 10px; font-size: 14px; font-weight: 700; cursor: pointer; border: none; transition: all .2s ease; white-space: nowrap; }
.btn-primary { background: #0055FF; color: #fff !important; }
.btn-primary:hover { background: #1043a8; transform: translateY(-1px); }
.btn-outline { background: transparent; color: #1043a8; border: 1.5px solid #1043a8; }
.btn-outline:hover { border-color: #1043a8; color: #1043a8; }
.btn-lg { padding: 20px 30px; font-size: 18px; }
.btn-block { width: 100%; }
.btn-sm { padding: 9px 18px; font-size: 13px; }

.reser_wrap h2 { font-size: 27px; font-weight: 800; color: #333; margin-bottom: 16px;}
.reser_wrap h3 { font-size: 20px; font-weight: 700; color: #333; margin-bottom: 12px;}
.reser_wrap p { font-size: 15px; color: #666; margin-bottom: 16px; line-height: 1.6;}
.reser_wrap .lead { font-size: 16px; color: #333; margin-bottom: 30px;}
.ph-note { display: inline-block; font-size: 12px; font-weight: 700; color: #FCD34D; background: rgba(252,211,77,0.1); border-radius: 100px; padding: 4px 12px;
margin-top: 16px; position: relative; z-index: 1; width: fit-content; }

.form-card { border: 1px solid #ddd; border-radius: 20px; padding: 40px;}
.form-row { margin-bottom: 30px; }
.form-row label { display: block; font-size: 18px; font-weight: 700; color: #333; margin-bottom: 8px;}
.form-row input, .form-row select, .form-row textarea { width: 100%; padding: 15px 15px; border: 1px solid #ddd; border-radius: 8px; font-size: 16px; font-family: inherit;
  color: #666; background-color:#fff;}
.form-row input:focus, .form-row select:focus, .form-row textarea:focus { outline: none; border-color: #ddd;}
.form-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.form-checkbox-group { display: flex; flex-direction: column; gap: 10px; }
.form-checkbox-group label { display: flex; align-items: center; gap: 10px; font-size: 16px; font-weight: 500; color: #333; border: 1px solid #ddd; border-radius: 8px;
  padding: 15px 15px; cursor: pointer;}
.form-checkbox-group input { width: auto; }
.form-note { font-size: 12.5px; color: #999; background: #f7f7f7; border-radius: 10px; padding: 14px 16px; margin-bottom: 24px;}   

.info-box { background: #F5F7FA; border-radius: 10px; padding: 25px 30px; margin-bottom: 30px; display: flex; gap: 22px; align-items: center;}
.info-box .info-box-icon { width: 64px; height: 64px; flex-shrink: 0; border-radius: 16px; background: #0055FF; border: 1px solid var(--gray-border); display: flex;
  align-items: center; justify-content: center; color: var(--primary);}
.info-box .info-box-icon svg { width: 34px; height: 34px; }
.info-box .info-box-text { min-width: 0; }
.info-box h4 { font-size: 18px; font-weight: 700; color: #333; width: 150px;}
.info-box p { font-size: 15px; color: #666; margin-bottom: 0; line-height: 1.6;}
@media (max-width: 767px) {
  .reser_wrap{ margin: 30px 0;}
  .form-card { border: 0; border-radius: 0; padding: 0 2%;}
  .form-row label { font-size: 16px;}
  .form-row input, .form-row select, .form-row textarea { padding: 10px 10px; border-radius: 5px; }
  .form-grid-2 { gap: 10px; }
  .info-box { flex-direction: column; align-items: flex-start; gap: 14px; padding: 20px 15px; }
}

/* === 통합 문진 폼 (Integrated Questionnaire) === */
.iq-secure { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: #666; margin-bottom: 10px;}
.iq-secure svg { width: 15px; height: 15px; stroke: #0055FF; }
.iq-title { font-size: 25px; font-weight: 700; color: #333; margin-bottom: 20px; }
.iq-steps { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 14px; color: #777; margin-bottom: 35px;}
.iq-steps .st { font-weight: 700; }
.iq-steps .st.on { color: #0055FF; }
.iq-steps .arr { color: #ccc; }
.iq-block { margin-bottom: 50px; }
.iq-block > .iq-h { font-size: 20px; font-weight: 700; color: #333; margin-bottom: 15px;}
.iq-block > .iq-h .iq-h-sub { font-size: 13px; font-weight: 600; color: #777; margin-left: 6px; }
.iq-desc { font-size: 15px; color:  #777; margin-bottom: 14px; }
.iq-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 15px; }
.iq-chip { display: inline-flex; align-items: center; gap: 6px; padding: 10px 20px; border-radius: 100px; border: 1.5px solid #ccc; background: #fff;
  font-size: 15px; font-weight: 700; color: #777; cursor: pointer; transition: all .15s ease; user-select: none;}
.iq-chip:hover { border-color: #EDF3FF; }
.iq-chip.on { border-color: #0055FF; background: rgba(0,85,255,0.07); color: #0055FF;}
.iq-chip .chk { display: none; }
.iq-chip.on .chk { display: inline; }
.iq-legend { display: flex; gap: 18px; flex-wrap: wrap; font-size: 11.5px; color: #666; background: #EDF3FF; border-radius: 10px;  padding: 10px 14px; margin-bottom: 4px;}
.iq-legend span { display: inline-flex; align-items: center; gap: 6px; }
.iq-legend .dot { width: 9px; height: 9px; border-radius: 3px; }
.iq-legend .dot.common { background: #666; }
.iq-legend .dot.cond { background: #0055FF; }
.iq-field { margin-bottom: 22px; }
.iq-field:last-child { margin-bottom: 0; }
.iq-field > label.iq-q { display: block; font-size: 15px; font-weight: 700; color: #333; margin-bottom: 10px; }
.iq-field input[type=text] { width: 100%; padding: 15px 15px; border: 1px solid #ddd; border-radius: 8px; font-size: 16px; font-family: inherit; color: #666;}
.iq-field input[type=text]:focus { outline: none; border-color: #0055FF; }
.iq-opts { display: flex; gap: 10px; flex-wrap: wrap; }
.iq-opt { padding: 10px 22px; border-radius: 100px; border: 1.5px solid #ddd; background: #fff; font-size: 15px; font-weight: 600; color: #666;
  cursor: pointer; transition: all .15s ease; user-select: none;}
.iq-opt:hover { border-color: #0055FF; }
.iq-opt.on { border-color: #0055FF; background: rgba(0,85,255,0.07); color: #0055FF; }
.iq-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; }
/* 조건부 블록 */
.iq-cond { background: rgba(0,85,255,0.04); border-radius: 14px; padding: 25px 30px; margin-bottom: 16px;}
.iq-cond.hidden { display: none; }
.iq-cond .iq-tag { display: inline-block; font-size: 13px; font-weight: 700; color:#0055FF; background:#fff; border: 1.5px solid #0055FF;
  border-radius: 100px; padding: 7px 15px; margin-bottom: 15px;}
.iq-cond .iq-q { color: #333; }
.iq-cond p { font-size: 15px; color: #666; margin: 0; line-height: 1.6;}
.iq-cond.note-block { border-style: dashed; border-color: var(--gray-border); background: var(--gray-light);}
.iq-cond.note-block .iq-tag { color: var(--gray-mid); border-color: var(--gray-border); }
.iq-cond.note-block p { color: var(--gray-mid); }
.iq-empty { border: 1.5px dashed #ddd; border-radius: 10px; padding: 18px 22px; margin-bottom: 16px; font-size: 15px; color:#666;}
/* 사전 준비 / 동의 */
.iq-prep {
  background: #FFF7E8; border: 1px solid #F5D78A; border-radius: 12px;
  padding: 16px 18px; display: flex; gap: 12px; align-items: flex-start;
}
.iq-prep svg { width: 20px; height: 20px; stroke: #C8881A; flex-shrink: 0; margin-top: 1px; }
.iq-prep .iq-prep-t { font-size: 13.5px; color: #7A5A12; font-weight: 600; }
.iq-consent label { display: flex; align-items: center; gap: 12px; border: 1px solid #ddd; border-radius: 8px; padding: 15px 15px; margin-bottom: 10px; font-size: 16px; font-weight: 600; color: #333; cursor: pointer;}
.iq-consent input { width: 18px; height: 18px; accent-color: var(--primary); }
@media (max-width: 767px) {
  .iq-pair { grid-template-columns: 1fr; gap: 18px; }
}




/* =========================================================
   고객센터 - 진료기록 사본발급 안내
========================================================= */

.record_wrap{
    width:100%;
    color:#333;
}

.record_intro{
    margin-bottom:45px;
}

.record_intro p{
    font-size:17px;
    font-weight:300;
    color:#333;
    line-height:1.8;
    margin-bottom:18px;
}

.record_intro p:last-child{
    margin-bottom:0;
}


/* 구비서류 표 */
.record_tbl table{
    table-layout:fixed;
}

.record_tbl tbody tr th{
    background:#f7f9fb;
    color:#222;
    font-weight:700;
}

.record_tbl tbody tr td{
    line-height:1.7;
    word-break:keep-all;
}


/* 표 아래 설명 */
.record_desc{
    margin-top:25px;
    font-size:16px;
    color:#666;
    line-height:1.7;
}


/* 안내 박스 */
.record_notice{
    margin-top:30px;
    padding:18px 22px;
    background:#f3f5f7;
    border-radius:30px;
    font-size:14px;
    color:#666;
    line-height:1.6;
}

.record_notice strong{
    display:block;
    color:#34495e;
    font-weight:700;
    margin-bottom:3px;
}

.record_notice span{
    display:block;
}


/* 다운로드 */
.record_download_section{
    margin-top:10px;
}

.record_download_intro{
    font-size:16px;
    color:#666;
    line-height:1.6;
    margin-bottom:22px;
}

.record_download_box{
    border:1px solid #dfe5ea;
    border-radius:15px;
    overflow:hidden;
    background:#fff;
}

.record_download_row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
    min-height:82px;
    padding:18px 25px;
    border-bottom:1px solid #e5e9ed;
}

.record_download_row:last-child{
    border-bottom:0;
}

.record_download_name{
    flex:1;
    font-size:16px;
    font-weight:600;
    color:#253a4d;
    line-height:1.5;
}

.record_download_name strong{
    color:#0A9FDF;
    margin-right:3px;
}

.record_download_btns{
    display:flex;
    align-items:center;
    gap:8px;
    flex-shrink:0;
}

.record_download_btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:120px;
    height:44px;
    padding:0 18px;
    border:1px solid #d9e1e7;
    border-radius:30px;
    background:#fff;
    color:#173b5d !important;
    font-size:14px;
    font-weight:700;
    text-decoration:none !important;
    transition:all .2s ease;
}

.record_download_btn:hover{
    background:#0A9FDF;
    border-color:#0A9FDF;
    color:#fff !important;
}


/* 하단 안내 */
.record_download_note{
    display:inline-block;
    margin-top:17px;
    padding:7px 14px;
    background:#f3f5f7;
    border-radius:30px;
    font-size:13px;
    color:#666;
    line-height:1.5;
}


/* =========================================================
   Tablet
========================================================= */
@media screen and (max-width:1023px){

    .record_intro{
        margin-bottom:35px;
    }

    .record_intro p{
        font-size:16px;
    }

    .record_desc{
        font-size:15px;
    }

    .record_download_name{
        font-size:15px;
    }

    .record_download_btn{
        min-width:110px;
        font-size:13px;
    }

}


/* =========================================================
   Mobile
========================================================= */
@media screen and (max-width:767px){

    .record_intro{
        margin-bottom:30px;
    }

    .record_intro p{
        font-size:15px;
        line-height:1.7;
        word-break:keep-all;
    }


    .record_tbl table{
        table-layout:auto;
        min-width:650px;
    }

    .record_tbl{
        overflow-x:auto;
        -webkit-overflow-scrolling:touch;
    }

    .record_tbl tbody tr th,
    .record_tbl tbody tr td{
        font-size:14px;
        line-height:1.6;
    }


    .record_desc{
        margin-top:18px;
        font-size:14px;
        word-break:keep-all;
    }


    .record_notice{
        margin-top:20px;
        padding:15px 16px;
        border-radius:12px;
        font-size:13px;
        word-break:keep-all;
    }


    .record_download_intro{
        font-size:14px;
        margin-bottom:15px;
    }

    .record_download_box{
        border-radius:10px;
    }

    .record_download_row{
        display:block;
        min-height:0;
        padding:18px 15px;
    }

    .record_download_name{
        font-size:14px;
        margin-bottom:14px;
        word-break:keep-all;
    }

    .record_download_btns{
        width:100%;
        gap:6px;
    }

    .record_download_btn{
        flex:1;
        min-width:0;
        height:42px;
        padding:0 7px;
        font-size:12px;
    }

    .record_download_note{
        margin-top:12px;
        padding:7px 10px;
        border-radius:10px;
        font-size:11px;
    }

}