.blind {text-indent: -9999px; font-size: 0; opacity: 0; visibility: hidden; line-height: 0; height: 0; width: 0;}
header{border-bottom: 1px solid #eee; box-sizing: border-box; width: 100%; background: #fff; height: 70px; overflow: hidden; position: sticky; top: 0; left: 0; z-index: 200;}
header .container {display: flex; justify-content: space-between; align-items: center; height: 100%;}
header .container h1 {flex: none; width: 42px; height: 40px; background: url(/m/img/ico/logo.png) 50% 50% no-repeat; background-size: 100% auto;}
header .container h1 a {display: block; width: 100%; height: 100%; font-size: 0;}
header.main_type .container h2 {font-size: 0; flex: none; width: 172px; height: 100%; background: url(/m/img/ico/headline.png) 50% 50% no-repeat; background-size: 100% auto;}
header.sub_type .container h2 {font-size: 20px; text-align: center; background: #fff; width: auto; color: #222; font-weight: 700; letter-spacing: -0.025em;}
header .container a.open_all_menu {flex: none; width: 30px; height: 30px; display: block; background: url(/m/img/ico/menu.png) 50% 50% no-repeat; background-size: 100% auto;}

@media all and (max-width: 375px) {
  header.sub_type .container h2 {font-size: 17px;}
}
@media all and (max-width: 320px) {
  header .container h1 {width: 32px;}
  header .container a.open_all_menu {width: 24px; height: 24px;}
  header.main_type .container h2 {width: 120px; }
  header.sub_type .container h2 {font-size: 14px;}
}



.container {width: 100%; padding: 0 18px; box-sizing: border-box;}


.all_menu {display: none; background: #fff;
  padding: 20px 20px 0; box-sizing: border-box; position: fixed; top: 0; left: 0; width: 100%;
  z-index: 202; height: 100vh; overflow-y: auto;}
.all_menu.on {display: block;}
.cls_all_menu {display: block; position: absolute; top: 20px; right: 20px; width: 20px; height: 20px; background: url(/m/img/ico/cls.png) 50% 50% no-repeat; background-size: 100% auto;  }
.login_btn {font-size: 0; width: 100px; height: 30px; background: url(/img/comm/login.png) 50% 50% no-repeat; background-size: 100% auto; cursor: pointer; display: block;}

.all_menu_bg {background: #fff url(/m/img/ico/all_menu_bg.png) 50% 100% no-repeat; background-size: 100% auto; padding: 0 0 calc(100% * 464 / 450); box-sizing: border-box;}

.point_area {margin: 20px 0 0; border: 1px solid #d9d9d9; box-sizing: border-box; border-radius: 20px; padding: 24px 16px;}
.point_area h3 {font-size: 16px; color: #222; font-weight: 400; text-align: center; margin: 0 0 16px; letter-spacing: -0.065em;}
.point_area h3 em {font-weight: 500;}
.point_area h3 b {font-weight: bold;}
.point_area ul.point_ul {padding: 7px 0 0; box-sizing: border-box; width: 100%; height: 100px; background: #f3f3f3; border-radius: 8px;}
.point_area ul.point_ul li {padding: 0 10px; box-sizing: border-box; width: 100%; font-size: 14px; font-weight: 700; color: #222; letter-spacing: -0.065em; line-height: 26px; display: flex; justify-content: space-between; align-items: center;}
.point_area ul.point_ul li b {flex: none;}
.point_area ul.point_ul li b span {color: #ff5050; font-weight: 700; display: inline-block; margin: 0 10px 0 0; font-size: 14px;}
.point_area .go_dir {width: 100%; display: block; margin: 20px 0 0;}
.point_area .go_dir a {display: flex; justify-content: flex-start; align-items: center; width: 100%; height: 35px; border-radius: 8px; box-sizing: border-box; padding: 0 12px; font-size: 14px; letter-spacing: -0.065em;}
.point_area .go_dir a + a {margin: 10px 0 0;}
.point_area .go_dir a.color1 {border: 1px solid var(--m-color); color: var(--m-color); background: #fff url(/img/comm/arr_color.png) calc(100% - 12px) 50% no-repeat;}
.point_area .go_dir a.color2 {border: 1px solid var(--m-color); color: #fff; background: var(--m-color) url(/img/comm/arr_white.png) calc(100% - 12px) 50% no-repeat;}


nav {width: 100%; margin: 12px 0 0;}
.gnb > li > a {background: #fff url(/m/img/ico/gnb_dir.png) calc(100% - 10px) 50% no-repeat; padding: 0 10px; font-size: 16px; font-weight: 500; color: #222; letter-spacing: -0.025em; display: flex; justify-content: flex-start; align-items: center; height: 60px; border-bottom: 1px solid #d9d9d9; box-sizing: border-box;}
.gnb > li > span {background: #fff url(/m/img/ico/gnb_off.png) calc(100% - 10px) 50% no-repeat; padding: 0 10px; font-size: 16px; font-weight: 500; color: #222; letter-spacing: -0.025em; display: flex; justify-content: flex-start; align-items: center; height: 60px; border-bottom: 1px solid #d9d9d9; box-sizing: border-box;}
.gnb .depth2 {display: none; padding: 16px 18px; box-sizing: border-box; width: 100%;}
.gnb .depth2 li a {font-size: 15px; font-weight: 500; color: #555; letter-spacing: -0.025em; line-height: 35px;}
.gnb > li.on > span {background: #fff url(/m/img/ico/gnb_on.png) calc(100% - 10px) 50% no-repeat;}
.gnb > li.on > .depth2 {display: block; border-bottom: 1px solid #d9d9d9; box-sizing: border-box;}




footer{background: #222; padding: 28px 18px 48px; box-sizing: border-box;}
footer .foot_top {padding-bottom:20px; }
footer .foot_top a {color:#999; }
footer address {color: #e4e4e4; font-size: 14px; line-height: 22px;}
footer address span {color: #b5b5b5;}
footer .copy {color: #999; font-size: 12px; letter-spacing: -0.025em; margin: 20px 0 0;}


.lnb .current {width: 100%; height: 50px; background: var(--m-color); display: flex; justify-content: center; align-items: center; text-align: center; font-size: 16px; color: #fff; letter-spacing: -0.025em;}
.lnb .current.active-lnb {background: var(--m-color) url(/m/img/ico/lnb_off.png) calc(100% - 20px) 50% no-repeat; }
.lnb.on .current.active-lnb {background: var(--m-color) url(/m/img/ico/lnb_on.png) calc(100% - 20px) 50% no-repeat; }
.lnb .lnb_depth2 {display: none; position: absolute; background: #fff; width: 100%;}
.lnb.on .lnb_depth2 {display: block;}
.lnb .lnb_depth2 a {text-align: center; display: block; border-bottom: 1px solid #eee; box-sizing: border-box; width: 100%; font-size: 15px; letter-spacing: -0.045em; line-height: 45px; color: #555; font-weight: 500;}


.page_lst {width: 100%; display: flex; justify-content: center; align-items: center; text-align: center;}
.page_lst > a,
.page_lst > b {flex: none; }
.page_lst > a {margin: 0 2px; border: 1px solid #eee; box-sizing: border-box; display: flex; justify-content: center; align-items: center; text-align: center; width: 30px; height: 30px; border-radius: 4px; background: #fff;}
.page_lst > a img {display: block;}
.page_lst b {display: block; padding: 0 14px; box-sizing: border-box; font-size: 15px; font-weight: 400; color: #777;  margin: 0 4px;}
.page_lst b span {margin: 0 4px;}
.page_lst b span a {font-size: 15px; font-family: 'Lato', sans-serif; }
.page_lst b em {font-family: 'Lato', sans-serif; color: #222; font-weight: 600; margin: 0 4px; font-size: 15px; display: inline-block;}