* {
    --common-width : 650px;
    --header-height: 6rem;
}
.korail {
    font-family: 'korail', sans-serif;
}
header {
    display: flex;justify-content: space-between;align-items: center;
    width: 100%;
    max-width: var(--common-width);
    height: var(--header-height);
    background-color: #fff;
    z-index: 100;
    position: fixed;left: 50%;top: 0;transform: translateX(-50%);
}
header h1 img {
    height: calc(var(--header-height) / 2);
    display: block;
}
header .open {
    cursor: pointer;
    width: var(--header-height);
    height: var(--header-height);
    background: url(../img/menu.png) no-repeat center / 2.5rem;
}
header .dummy {
    width: var(--header-height);
    height: var(--header-height);
}

nav .inner {
    transition: all .5s cubic-bezier(0.175, 0.885, 0.32, 1);
    background-color: #fff;
    overflow-y: scroll;
    position:fixed;
    z-index: 1000;
    height:100%;
    width:75%;
    top:0;
    right: -100%;
}
nav .outer {
    background-color:rgba(0, 0, 0, .5);
    min-height: 100vh;
    position:fixed;
    display: none;
    z-index: 999;
    width:100%;
    left:0;
    top:0;
}
nav.on .inner {display: block;right: 0;}
nav.on .outer {display: block;}
nav .nav_header {
    justify-content: right;
    align-items: center;
    display: flex;
    height: var(--header-height);
}
nav .nav_header .close {
    height: var(--header-height);
    width: var(--header-height);
    background: url(../img/close.png) no-repeat center / 2rem;
}
nav .content {
    padding: 0 1.5rem;
}
nav .content li {}
nav .content li a {
    font-size: 1.7rem;
    color: #5c5e6b;
    padding: 2rem 0 2rem 3rem;
    font-weight: 500;
    display: flex;
    position: relative;
    border-bottom: 1px dotted #e6e6e6;
    background: url(../img/menu-arrow.png) no-repeat 100% center / .8rem;
}
nav .content li.on a {
    color: #b3cc1d;
    font-weight: bold;
}
nav .content li a::before {
    content: "";
    position: absolute;
    left: 0;top: 50%;transform: translateY(-50%);
    width: 2rem;height: 2rem;
}
nav .content li:nth-of-type(1) a::before {background: url(../img/menu-btn-off-1.png) no-repeat center / contain;}
nav .content li:nth-of-type(2) a::before {background: url(../img/menu-btn-off-2.png) no-repeat center / contain;}
nav .content li:nth-of-type(3) a::before {background: url(../img/menu-btn-off-3.png) no-repeat center / contain;}
nav .content li:nth-of-type(4) a::before {background: url(../img/menu-btn-off-4.png) no-repeat center / contain;}
nav .content li:nth-of-type(5) a::before {background: url(../img/menu-btn-off-5.png) no-repeat center / contain;}
nav .content li:nth-of-type(6) a::before {background: url(../img/menu-btn-off-6.png) no-repeat center / contain;}
nav .content li:nth-of-type(1).on a::before {background: url(../img/menu-btn-on-1.png) no-repeat center / contain;}
nav .content li:nth-of-type(2).on a::before {background: url(../img/menu-btn-on-2.png) no-repeat center / contain;}
nav .content li:nth-of-type(3).on a::before {background: url(../img/menu-btn-on-3.png) no-repeat center / contain;}
nav .content li:nth-of-type(4).on a::before {background: url(../img/menu-btn-on-4.png) no-repeat center / contain;}
nav .content li:nth-of-type(5).on a::before {background: url(../img/menu-btn-on-5.png) no-repeat center / contain;}
nav .content li:nth-of-type(6).on a::before {background: url(../img/menu-btn-on-6.png) no-repeat center / contain;}

main {
    width: 100%;
    margin: 0 auto;
    min-height: 100vh;
    max-width: var(--common-width);
    padding-top: var(--header-height);
    padding-bottom:2rem;
}







/* =================================================================== */

.today_plan {
}
.today_plan h2 {
    gap: 1rem;
    height: 16rem;
    margin: 1.5rem;
    padding: 1.5rem;
    font-weight: bold;
    align-items: center;
    border-radius: 1rem;
    background-color: #b3cc1d;
    display: flex;justify-content: space-between;
}
.today_plan h2 span {
    font-family: inherit;
    font-size: 1.4rem;
    color: #ffffff;
    line-height: 1.4;
}
.today_plan h2 b {
    margin: .5rem 0 2rem;
    font-family: inherit;
    font-size: 2.2rem;
    color: #ffffff;
    line-height: 1.2;
    display: block;
    font-weight: 800;
}
.today_plan h2 img {width:35%;margin-bottom: 3rem;}
.today_plan .today_toggle {
    padding: 1.5rem;
    margin: 2rem 3rem 0;
    border-radius: 10rem;
    background-color: #fff;
    border: 3px solid #ddd356;
    position: relative;bottom: 5rem;
    display: flex;flex-direction: column;
    box-shadow: 0 .2rem .5rem rgba(0, 0, 0, .3);
}
.today_plan .today_toggle.on {
    border-radius: 1rem;
}
.today_plan .toggle_open {
    color: #565d71;
    font-size: 1.6rem;
    cursor: pointer;
    order: 1;
    display: flex;justify-content: space-between;
}
.today_plan .toggle_open b {
    line-height: inherit;
    font-weight: 800;
    font-size: inherit;
    color: inherit;
}
.today_plan .toggle_content {
    display: none;
    order: 2;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e3e3e3;
}
.today_toggle.on .toggle_content {display: block;}
.today_plan .toggle_content .title {
    display: flex;justify-content: space-between;align-items: center;
    font-size: 1.6rem;
    font-weight: bold;
    line-height: 1.4;
    color: #212747;
}
.today_plan .toggle_content .title a {
    line-height: inherit;
    padding: .5rem 1rem;
    font-size: 1.4rem;
    border-radius: 10rem;
    color: #dadada;
    width: fit-content;
    display: block;
}
.today_plan .toggle_content .box {
    border-radius: .5rem;
    display: block;
    margin: 1.5rem 0;
}
.today_plan .toggle_content .box p {
    font-size: 2rem;
    color: #cccccc;
    margin: 0.8rem 0;
    line-height: 1.4;
    display: flex;align-items: center;gap: .5rem;
}
.today_plan .toggle_content .box p b {
    line-height: inherit;
    font-size: 1.6rem;
    color: #595959;
}
.today_plan .toggle_content .box p b:nth-of-type(1) {
    line-height: inherit;
    padding: .4rem .8rem;
    font-size: 1.4rem;
    border-radius: .5rem;
    color: #fff;
    display: block;
    text-align: center;
    min-width:9rem;
}
.today_plan .toggle_content .box p:nth-of-type(1) b:nth-of-type(1) {
    background-color: #b3cc1d;
}
.today_plan .toggle_content .box p:nth-of-type(2) b:nth-of-type(1) {
    background-color: #5dde5b;
}
.today_plan .toggle_content .box p:nth-of-type(3) b:nth-of-type(1) {
    background-color: #93de5b;
}
.noresult {
    font-size: 1.6rem;
    color: #ccc;
    text-align: center;
    padding: 3rem 0 6rem;
}








.home_banner {display: flex;gap: 1.5rem;padding: 0 1.5rem 3rem;border-bottom: .7rem solid #f2f2f2;margin-bottom: 1.5rem;}
.home_banner a {
    padding: 1.5rem;
    border-radius: 1rem;
    text-align: center;
    width: calc(50% - .5rem);
    border: 1px solid #b2cb1a;
    background-color: #f2f2f2;

    color:#b3cc1d;
    margin-bottom: .5rem;
    font-weight: bold;
    font-size: 1.8rem;
    line-height: 1.2;
}
.home_banner img {
    height: 8rem;
    padding: .5rem;
    display: block;
    margin: 0 auto 1rem;
}



/* 검색페이지 */
.search_page {padding: 1.5rem;}
.search_page h2 {
    line-height: 1.4;
    font-weight: 800;
    font-size: 1.8rem;
    color: #2c2c2c;
    margin-bottom: 2rem;
}
.search_page h2 b {
    font-family: inherit;
    line-height: inherit;
    font-weight: inherit;
    font-size: inherit;
    color: #b3cc1d;
}
.search_page form {
    display: flex;
    position: relative;
}
.search_page form input[type="text"] {
    width: calc(100% - 6rem);
    height: 5rem;
    font-size: 1.6rem;
    padding: 0 1.5rem;
    border-radius: 10rem;
    background-color: #fff;
    border: 4px solid #b3cc1d;
}
.search_page form input[type="text"]::placeholder {color: #ccc;}
.search_page form input[type="submit"] {
    width: 6rem;
    height: 5rem;
    position: relative;
    background: url(../img/search.png) no-repeat 45% center / 40%;
}
.search_page form::after {
    content: "";
    z-index: -1;
    position: absolute;
    border-radius: 10rem;
    background-color: #fff;
    left: -3px;top: -3px;
    height: calc(100% + 6px);
    width: calc(100% - 6rem + 6px);
}
.search_page form::before {
    content: "";
    position: absolute;
    right: 0;top: 50%;
    border-radius: 1rem 10rem 10rem 1rem;
    transform: translateY(-50%);
    height: 100%;width: 7rem;
    background-color: #b3cc1d;
    z-index: -2;
}
.search_page .result li {
    display: block;
    cursor: pointer;
    padding: 1.5rem;
    margin: 1.5rem 0;
    border-radius: 1rem;
    background-color: #fff;
    border: 1px solid #bdd33a;
}
.search_page .result li:nth-of-type(1) {margin-top: 2.5rem;}
.search_page .result h3 {
    line-height: 1.4;
    font-size: 1.6rem;
    font-weight: bold;
    color: #232d48;
    margin-bottom: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.search_page .result h3 b {
    color: #fff;
    display: block;
    font-weight: 300;
    font-size: 1.4rem;
    border-radius: .5rem;
    text-align: center;
    width: fit-content;
    padding: .5rem 1.3rem;
    background-color: #b3cc1d;
}
.search_page .result h4 {
    font-size: 1.6rem;
    line-height: 1.4;
    color: #545b60;
}




/* 검색모달 */
#modal {}
#modal .prev {
    display: none;
    width: 5rem;height: 4rem;
    left: 1.5rem;top: 1.5rem;
    margin: 0 0 0 auto;
    background: url(../img/close.png) no-repeat center 1.5rem / 2rem;
}
#modal .inner {
    position: fixed;
    bottom: -100%;
    z-index: 999;
    left: 50%;
    height: calc(100vh - var(--header-height) - 5rem - 1.5rem);
    display: none;
    border-radius: .8rem;
    width: calc(100vw - 3rem);
    background-color: #fff;
    transform: translate(-50%, 0);
    top: calc(var(--header-height) + 3rem);
    max-width: calc(var(--common-width)- 3rem);
}
#modal .inner .content_wrap {
    overflow-y: scroll;
    height: 100%;
    height: calc(100% - 5rem - 4rem);
}
#modal .inner .content_wrap .commonBtn {
    margin-top: 3rem;
}
#modal .inner h2 {
    width: 100%;
    height: 5rem;
    color: #212b47;
    font-weight: 800;
    font-size: 1.6rem;
    line-height: 1.2;
    text-align: center;
    padding: 0 1.5rem;
    border-radius: 1rem;
    display: flex;justify-content: center;
}
#modal .inner h3 {
    font-size: 1.6rem;
    line-height: 1.4;
    color: #b0ca14;
    font-weight: bold;
    padding: 2rem 0 0.5rem;
    margin: 1.5rem;
    border-top: 1px dotted #ddd;
}
#modal .inner h3:nth-of-type(1) {
    padding-top: 0rem;
    border-top: none;
    margin-top: 0;
}
#modal .inner p {
    font-size: 1.6rem;
    line-height: 1.6;
    color: #ccc;
    margin: 0 1.5rem .5rem;
}
#modal .inner p b {
    line-height: inherit;
    font-weight: bold;
    font-size: inherit;
    display: block;
    color: #000000;
}
#modal .inner p span {
    line-height: inherit;
    font-size: inherit;
    display: block;
    color: #5c5e6b;
}
#modal .outer {
    min-width: 100vw;
    min-height: 100vh;
    position: fixed;
    left: 0;
    top: 0;
    display: none;
    z-index: 998;
    box-shadow: 0 0 .5rem rgba(0, 0, 0, .3);
    background: rgba(0, 0, 0, .3);
}
#modal.on .prev {display: block;}
#modal.on .inner {display: block;}
#modal.on .outer {display: block;}




/* 뉴스 */
.news_wrap .common_h2 {margin:3rem 1.5rem 1.5rem;}
.news_swiper {padding: 0 1.5rem 1.5rem !important;}
.news_swiper .news_box {height: 20rem;}
.news_swiper .news_box .swiper-slide {background-color: #fff;padding: 1.5rem;display: flex;justify-content: space-between;gap: 1.5rem;border-radius: 1rem;border: 1px solid #b2cb1b;}
.news_swiper .news_box .swiper-slide h3 {font-size: 1.6rem;font-weight: bold;line-height: 1.4;word-break: break-all;color: #000;margin-bottom: 1rem;}
.news_swiper .news_box .swiper-slide p {font-size: 1.4rem;line-height: 1.4;font-weight: 300;color: #555765;margin-bottom: 1rem;}
.news_swiper .news_box .swiper-slide img {display: block;width: 50%;height: 100%;object-fit: cover;}
.news_swiper .news_box .swiper-slide > span {width: 50%;}
.swiper-button-next:after, .swiper-button-prev:after {opacity: 0;}
.swiper-button-prev {background: url(../img/left1.png) no-repeat center / 0.9rem;}
.swiper-button-next {background: url(../img/right1.png) no-repeat center / 0.9rem;}


.news .newslink {height: 20rem;margin: 1rem 1.5rem;display: flex;gap: 1rem;border: 1px solid #f3f3f3;border-radius: 1rem;padding: 2.5rem 1rem;}
.news .newslink img {width: 100%;display: block;height: 100%;object-fit: cover;border-radius: .5rem;}
.news .newslink > span {width: 50%;}
.news .newslink h3 {font-size: 1.8rem;font-weight: bold;word-break: break-all;color: #373332;line-height: 1.4;}
.news .newslink p {font-size: 1.4rem;color: #627791;line-height: 1.4;font-weight: 300;margin-top: .3rem;}
.news .newslink .date {font-size: 1.2rem;color: #627791;line-height: 1.4;font-weight: 300;margin-top: 1rem;}
.text_wrap {display: flex;flex-direction: column;justify-content: space-between;}



.news_sub {padding-left: 1.5rem;padding-right: 1.5rem;}
.news_sub h2 {font-size: 1.8rem;font-weight: 800;line-height: 1.4;color: #27314c;padding-top: 3rem;margin-bottom: 1rem;}
.news_sub p {font-size: 1.2rem;line-height: 1.4;color: #3a4ede;font-weight: bold;margin-bottom: 2rem;padding-bottom: 1.5rem;border-bottom: 1px solid #d8d8d8;}
.news_sub pre {font-size: 1.6rem;line-height: 1.4;color: #617690;margin-bottom: 4rem;}
.news_sub img {width: 100%;margin-bottom: 2rem;}
.commonBtn {height: 5rem;width: 100%;display: flex;justify-content: center;align-items: center;font-size: 1.6rem;color: #fff;background-color: #b3cc1d;border-radius: 0 0 .5rem .5rem;font-weight: bold;}



/* qna_wrap */
.qna_wrap {margin: 0 1.5rem 1.5rem;}
.qna_wrap li {font-size: 1.6rem;color: #627791;display: block;line-height: 1.4;padding: 1.5rem 1.5rem 1.5rem 1.5rem;border-bottom: 1px dotted #e7e7e7;}
.qna_wrap li b {
    line-height: inherit;
    font-weight: inherit;
    font-size: inherit;
    color: #b3cc1d;
}
.qna_wrap li:first-of-type {margin-top: 1.5rem;}
.qna_wrap li:first-of-type {border-top: 2px solid #b3cc1d;}
.qna_wrap li:last-of-type {border-bottom: 2px solid #b3cc1d;}
.qna_wrap li a {
    line-height: inherit;
    font-weight: inherit;
    font-size: inherit;
    color: inherit;
}
.qna_sub {border: 1px solid #f3f3f3;border-radius: 1rem;margin: 1.5rem;padding: 1.5rem 1.5rem;}
.qna_sub h2 {padding: 1.5rem 0;line-height: 1.4;color: #676975;font-size: 1.6rem;border-bottom: 2px solid #cacaca;}
.qna_sub pre {font-size: 1.6rem;line-height: 1.4;color: #0e3c5a;padding:1.5rem 0;}


#modal.mdqna .inner h2 {
    border-bottom: 1px dotted #ddd;
    height: fit-content;
    min-height: 5rem;
    font-size: 2rem;
    padding: 1.5rem;
}
#modal.mdqna .inner .content_wrap {
    height: calc(100% - 15rem);
    line-height: 1.6;
    font-size: 1.6rem;
    display: block;
    padding: 1.5rem 1.5rem 8rem;
    color: #5c5e6b;
}
#modal.mdqna .inner .content_wrap img {
    width: 100%;margin-bottom: 1.5rem;
}
#modal.mdqna.on .inner {display: flex;justify-content: space-between;flex-direction: column;}


.common_h2 {
    color: #000;
    font-size: 2rem;
    font-weight: 800;
    padding: 1.3rem 0;
    display: flex;justify-content: space-between;align-items: center;
}
.common_h2 a {
    line-height: inherit;
    font-weight: normal;
    font-size: 1.4rem;
    color: #aaa;
}

/* sub_page */
section.sub_page {
    margin: 1.5rem;
}
section.sub_page h2 {
    color: #000;
    font-size: 2rem;
    font-weight: 800;
    padding: 1.3rem 0;
}
section.sub_page pre {
    font-size: 1.6rem;
    line-height: 1.4;
    color: #595c69;
    padding: 1.3rem 0;
}
section.sub_page b {
    line-height: inherit;
    font-size: inherit;
    font-weight: bold;
    color: #b0ca14;
}







.blue_title {
    font-size: 1.6rem;
    color: #fff;
    padding: 1.2rem 1.5rem;
    width: fit-content;
    margin-left: 1.5rem;
    background-color: #b3cc1d;
    border-radius: 1rem 1rem 0 0;
}



