/* #content */
section .main_title {letter-spacing: -0.02em; line-height: 56px; margin-bottom: 20px;}
section .main_title.on {display: none;}
section .sub_text {letter-spacing: -0.02em;}

.medical_top {background: #EAF2FF; margin-bottom: 110px;}
.medical_top .inner {padding: 110px 0; box-sizing: border-box; text-align: center;}
.medical_top .inner h3 {font-size: 70px; font-weight: 700; line-height: 1em; letter-spacing: -1px; margin-bottom: .5em;}
.medical_top .inner p {font-size: 28px; line-height: 1em; letter-spacing: -1px; color: #161718;}


.form_box {padding: 0 16.66%; position: relative;}
.form_box .select_area {width: 50%; display: grid; grid-template-columns: repeat(3, 1fr); align-items: stretch; gap: 14px; margin: 0 auto 50px;}
.form_box form .select_area select {width: 100%; padding: 11.5px 10%; box-sizing: border-box; appearance: none; outline: none; border-radius: 190px; border: 1px solid #0C82FE;
    font-family: 'Noto Sans KR', sans-serif; font-size: 18px; font-weight: 700; letter-spacing: -1px; line-height: normal; color: #0C82FE; cursor: pointer;
    background: url(../images/arrow_down_blue.png) no-repeat right 10% center; background-size: 24px;}
.form_box form .select_area select.on {background: url(../images/arrow_up_blue.png) no-repeat right 10% center; background-size: 24px;}
.form_box form .select_area select option:disabled {background:#f3f3f3;}
.form_box form .select_area .btn_submit {display: block; width: 100%; padding: 11.5px 5%; box-sizing: border-box; background: #0C82FE; border-radius: 190px;
    font-size: 18px; font-weight: 700; line-height: normal; letter-spacing: -1px; color: #fff; border: none; outline: none;}


.list_box {padding: 0 16.66% 160px;}
.list_box > ul {display: grid; grid-template-columns: repeat(3, 2fr); gap: 16px;}
.list_box > ul > li .img_box {position: relative; border-radius: 16px; overflow: hidden;}
.list_box > ul > li .img_box .blur {width: 100%; height: 100%; background: rgba(0,0,0, .5); backdrop-filter: blur(2px);
    position: absolute; top: 0; left: 0; z-index: 10;}
.list_box > ul > li .img_box .blur p {width: 100%; height: 100%; font-weight: 500; font-size: 22px; line-height: 32px; letter-spacing: -0.02em; color: #fff; 
    text-align: center; display: flex; align-items: center; justify-content: center;}
.list_box > ul > li .img_box img {width: 100%; border-radius: 16px;}
.list_box > ul > li .text_box {margin: 16px 3%; color: #161718;}
.list_box > ul > li .text_box > span {display: block; color: #0C82FE; font-weight: 700; font-size: 12px; line-height: 18px;}
.list_box > ul > li .text_box > p a {font-weight: 500; font-size: 22px; line-height: 32px; letter-spacing: -0.02em; color: #161718;}
.list_box > ul > li .text_box > p a span {color: #0C82FE;}


.more_btn {display: none;}


.btn_write {padding: 10px 36px; box-sizing: border-box; white-space: nowrap;
    font-size: 24px; font-weight: 500; letter-spacing: -1px; line-height: 40px; color: #161718;
    border-radius: 75px; border: 1px solid #777C81; outline: none; background: #FFF; position: absolute; right: calc(16% + 62px); top: 50%; transform: translateY(-50%);}
.btn_write::after {display: none !important;}
.btn_write:hover {border: 1px solid #0C82FE; background: #0C82FE; color: #fff;}

/* PC (해상도 1440px ~ 1540px) */
@media screen and (max-width:1540px) {
    .form_box {padding: 0 12%;}
    .list_box {padding: 0 12%;}
    .btn_write { right: calc(12% + 62px);}
}
/* PC (해상도 1058px ~ 1440px) */
@media screen and (max-width:1440px) {
    .form_box {padding: 0 8%;}
    .list_box {padding: 0 8%;}
    .btn_write { right: calc(8% + 62px);}
}
/* PC (해상도 1024px ~ 1058px) */
@media screen and (max-width:1058px) {
    .form_box {padding: 0 6%;}
    .list_box {padding: 0 6%;}
    .btn_write { right: calc(6% + 62px);}
}


/* 태블릿 (해상도 769px ~ 1024px) */
@media screen and (max-width:1024px) {
    /* content */
    section .main_title {font-size: 28px; margin-bottom: 12px; line-height: 36px;}
    section .main_title i {display: block;}

    .medical_top {margin-bottom: 80px;}
    .medical_top .inner {padding: 80px 0;}
    .medical_top .inner h3 {font-size: 42px;}
    .medical_top .inner p {font-size: 14px;}


    .form_box {padding: 0 5%;}
    .form_box .select_area {width: 80%; margin: 0 auto 40px;}
    .form_box form .select_area select {padding: 8px 10%;}
    .form_box form .select_area .btn_submit {padding: 8px 5%;}


    .list_box {padding: 0 5% 80px;}
    .list_box > ul {grid-template-columns: repeat(2, 3fr); column-gap: 16px; row-gap: 28px;}
    .list_box > ul > li .img_box .blur p {font-size: 20px; line-height: 25px;}
    .list_box > ul > li .img_box ul {gap: 1.5px;}
    .list_box > ul > li .text_box > span {font-weight: 600; font-size: 10px; line-height: 12px;}
    .list_box > ul > li .text_box > p {font-size: 20px; line-height: 25px;}

    .btn_write {display: none;}
}

/* 모바일 가로, 모바일 세로 (해상도 375px ~ 768px)*/
@media screen and (max-width:768px) {
    .wrap { min-width: 375px; }
    /* content */
    .medical_top {margin-bottom: 50px;}
    .medical_top .inner {padding: 50px 0;}
    .medical_top .inner h3 {font-size: 36px;}


    .form_box .select_area {width: 100%; gap: 12px; margin: 0 auto 30px;}
    .form_box form .select_area select {padding: 6px 10%;}
    .form_box form .select_area .btn_submit {padding: 6px 5%;}


    .list_box > ul {grid-template-columns: repeat(1, 3fr); gap: 16px;}
    .list_box > ul > li .img_box {border-radius: 8px;}
    .list_box > ul > li .img_box img {border-radius: 8px;}
    .list_box > ul > li .img_box ul {gap: 1px; border-radius: 8px; overflow: hidden;}
    .list_box > ul > li .img_box ul li:first-child > div {border-radius: 8px 0 0 8px; overflow: hidden;}
    .list_box > ul > li .img_box ul li:last-child > img {border-radius: 0 8px 8px 0;}
    .list_box > ul > li .text_box {margin: 12px 0;}

}