#wrap {min-height: 100vh;width: 100%;padding-top: 6rem;padding-bottom: 1rem;background-color: #f3f6fb;}
#wrap.index {display: flex;flex-direction: column;justify-content: center;padding-left: 10%;}
#wrap.index img {width: 60%;margin-bottom: 60%;}
header, .header {position: fixed;left: 0;top: 0;width: 100%;height: 6rem;background-color: #f3f6fb;display: flex;align-items: center;justify-content: space-between;z-index: 100;}
.header {padding-left: 2rem;}
.header a img {width: 13rem;}
header {padding: 0 1.5rem;}
header h1 {font-size: 1.8rem;font-weight: 500;text-align: center;font-family: 'GmarketSans', sans-serif;line-height: 1.2;}
header .prev, header .dummy {width: 1.8rem;height: 3rem;object-fit: contain;}



/* home */
.banner_wrap {margin-top: 3rem;}
.banner_wrap a {display: block;margin: .5rem 1.5rem;}
.banner_wrap a img {width: 100%;}
.home_wrap {margin: 1.5rem;}
.home_wrap h2 {border-bottom: 1px solid #ebedef;padding: 1rem 0;margin-top: 2rem;margin-bottom: 1rem;}
.home_wrap h2 em {font-size: 1.8rem;font-weight: 500;color: #252f4b;padding: calc(1rem - 3px) 0;font-family: 'GmarketSans', sans-serif;border-bottom: 3px solid #3c8fd2;}
.home_wrap pre {padding: 1rem;font-size: 1.6rem;line-height: 1.4;border-radius: .7rem;background-color: #fff;border: 1px solid #dedede;}
.home_wrap span {display: flex;justify-content: space-between;align-items: center;}
.home_wrap span a {margin-right: .5rem;width: 100%;}
.home_wrap span a:last-of-type {margin-right: 0;}
.home_wrap span a img {width: 100%;}



/* sub_wrap */
.sub_wrap {margin: 1.5rem;}
.sub_wrap h2 {font-size: 1.8rem;font-weight: 500;position: relative;color: #836096;padding-left: 2rem;}
.sub_wrap h2::before {content: "";position: absolute;left: 0;top: 50%;transform: translateY(-50%);width: 1.5rem;height: 1.5rem;background-color: #836096;}
.sub_wrap img {width: 100%;margin-top: 1.5rem;}
.sub_wrap span img {width: 100%;margin-top: 0;margin-bottom: 1.5rem;}
.sub_wrap pre {color: #32415c;margin-top: 1rem;margin-bottom: 3rem;font-size: 1.6rem;line-height: 1.4;}
.sub_wrap pre b {font-size: inherit;color: #000;font-weight: 600;}
.sub_wrap h3 {border-bottom: 1px solid #ebedef;padding: 1rem 0;margin-top: 2rem;margin-bottom: 1rem;}
.sub_wrap h3 em {font-size: 1.8rem;font-weight: 500;color: #252f4b;padding: calc(1rem - 3px) 0;font-family: 'GmarketSans', sans-serif;border-bottom: 3px solid #3c8fd2;}
.sub_wrap ul {}
.sub_wrap ul li {}
.sub_wrap ul li a {border-radius: .5rem;background-color: #fff;box-shadow: .1rem .1rem .3rem rgba(0, 0, 0, .1);font-size: 1.6rem;padding: 1.5rem;display: block;margin-bottom: 1rem;background: #fff url('../img/arrow.png') no-repeat calc(100% - 1.8rem) center / .6rem;font-weight: 600;}



/* toggle_wrap */
.toggle_wrap_click {display: flex;justify-content: space-between;align-items: center;width: 100%;height: 5rem;background-color: #fff;}
.toggle_wrap_click a {display: flex;justify-content: center;align-items: center;width: 50%;height: 100%;font-size: 1.6rem;font-weight: 500;border-bottom: 2px solid transparent;}
.toggle_wrap_click a.on {border-bottom: 2px solid #4091d3;}
.toggle_wrap .box {margin: 1rem 1.5rem;padding: 0 1.5rem;background-color: #fff;border-radius: .5rem;box-shadow: .1rem .1rem .3rem rgba(0, 0, 0, .1);}
.toggle_wrap h2 {background: #fff url('../img/toggle_open.png') no-repeat 100% center / 1rem;font-size: 1.6rem;font-weight: bold;padding: 1.5rem 0;}
.toggle_wrap pre {display: none;font-size: 1.6rem;line-height: 1.4;padding: 1.5rem 0;}
.toggle_wrap .box.open h2 {background: #fff url('../img/toggle_close.png') no-repeat 100% center / 1rem;border-bottom: 1px solid #ccc;}
.toggle_wrap .box.open pre {display: block;}



/* qna_wrap */
.qna_wrap .box {margin: 1.5rem 2rem;border-radius: 1rem;background-color: #4aa7aa;}
.qna_wrap .box h4 {color: #fff;line-height: 1.2;font-size: 1.8rem;font-weight: 500;position: relative;padding: 1.3rem 3.5rem;border-radius: .5rem;background: url('../img/qna_open.png') no-repeat calc(100% - 1.5rem) center / 1.3rem;}
.qna_wrap .box h4::before {position: absolute;top: 1.45rem;left:1.3rem;content: "Q.";}
.qna_wrap .box.open h4 {background: url('../img/qna_close.png') no-repeat calc(100% - 1.5rem) center / 1.3rem;}
.qna_wrap .box h4 span {font-size: 1.6rem;color: #00488c;display: block;margin-top: .5rem;}
.qna_wrap .box pre {display: none;line-height: 1.4;font-size: 1.6rem;padding: 1.5rem 1rem;word-break: break-all;background-color: #f7f7f7;}
.qna_wrap .box.open pre {display: block;}



/* page_wrap */
.page_wrap {display: flex;justify-content: center;align-items: center;margin: 2rem 0 4rem;}
.page_wrap img {width: .7rem;}
.page_wrap .prev {margin-right: 1.5rem;}
.page_wrap .after {margin-left: 1.5rem;}
.page_wrap .page {}
.page_wrap .page a {
    font-size: 1.8rem;
    margin: .7rem;
    color: #626262;
}
.page_wrap .page a.color {
    font-weight: bold;
    color: #4aa7aa;
}