/*   Main   */
/* Layout */
.container-full { width: 100%; }

#container { width: 1200px; margin: 0 auto; display: flex; justify-content: space-between; padding-bottom: 100px; }

#contents { width: 890px; }

#contents-home { width: 100%; max-width: 980px; padding: 0 15px; margin: 0 auto; padding-bottom: 100px; }

.mobile-only { display: none !important; }

.flex { display: flex; }
.flex.center { justify-content: center; align-items: center; }

footer { width: 100%; border-top: 1px solid #dedede; padding: 20px 0 30px 0; }
footer .addr { font-size: 16px; color: #454545; padding-right: 10px; border-right: solid 1px #dedede; line-height: 24px; }
footer .call { font-size: 16px; color: #454545; padding-left: 10px; line-height: 24px; }
footer .copyright { font-size: 16px; color: #969696; text-align: center; line-height: 24px; }

@media screen and (max-width: 960px) { #contents-home { padding-bottom: 60px; }
  footer { padding: 20px 0 14px 0; }
  footer .flex { display: block; }
  footer .addr { font-size: 12px; line-height: 18px; padding-right: 0; border-right: none; text-align: center; margin-bottom: 10px; }
  footer .call { font-size: 12px; line-height: 18px; padding-left: 0; text-align: center; }
  .mobile-only { display: block !important; }
  .mobile-hide { display: none !important; } }
header .wrapper-top { display: flex; align-items: center; height: 100px; border-bottom: 1px solid #dedede; }
header .wrapper-top .wrapper { padding: 0 20px; width: 100%; max-width: 1180px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; }
header .wrapper-top .wrapper .logo { display: block; width: 145px; height: 40px; background: url("../_images/common/logo.png") no-repeat center; background-size: 145px; }
header .wrapper-top .wrapper .menu { width: calc(100% - 145px); display: flex; justify-content: flex-end; align-items: center; }
header .wrapper-top .wrapper .menu a { display: block; width: calc(100% / 6); font-size: 20px; font-weight: 700; line-height: 40px; color: #000; text-align: right; }
header .wrapper-inter { display: none; position: absolute; left: 0; top: 100px; width: 100%; background: #fff; z-index: 10; }
header .wrapper-inter .wrapper-menu { display: flex; justify-content: center; align-items: center; }
header .wrapper-inter .wrapper-menu .mobile-top { display: none; }
header .wrapper-inter .wrapper-menu .menu-wrap { padding: 20px 20px 40px; width: 100%; max-width: 1180px; margin: 0 auto; display: flex; justify-content: space-between; }
header .wrapper-inter .wrapper-menu .menu-wrap .menu-group .title { font-size: 16px; font-weight: 700; line-height: 30px; color: #000; padding-bottom: 10px; }
header .wrapper-inter .wrapper-menu .menu-wrap .menu-group .text { font-size: 16px; line-height: 30px; color: #454545; }

@media screen and (max-width: 960px) { header .wrapper-top { height: 60px; }
  header .wrapper-top .wrapper { padding: 0 0 0 15px; }
  header .wrapper-top .wrapper .logo { display: block; width: 109px; height: 30px; background: url("../_images/common/logo.png") no-repeat center; background-size: 109px; }
  header .wrapper-top .wrapper .menu { display: none; }
  header .wrapper-top .wrapper .mobile-menu { width: 60px; height: 60px; background: url("../_images/common/mobile-menu@2x.png") no-repeat center/24px; }
  header .wrapper-inter { position: fixed; height: 100vh; top: 0; z-index: 20; }
  header .wrapper-inter .wrapper-menu { display: block; }
  header .wrapper-inter .wrapper-menu .mobile-top { border-bottom: 1px solid #dedede; display: flex; justify-content: space-between; }
  header .wrapper-inter .wrapper-menu .mobile-top p { font-size: 20px; font-weight: 700; padding-left: 15px; line-height: 60px; }
  header .wrapper-inter .wrapper-menu .mobile-top .menu-close { width: 60px; height: 60px; background: url("../_images/common/icon-s-cross@2x.png") no-repeat center/18px; }
  header .wrapper-inter .wrapper-menu .menu-wrap { overflow: auto; padding: 0 15px 60px; display: block; height: calc(100vh - 60px); }
  header .wrapper-inter .wrapper-menu .menu-wrap .menu-group .title { margin-top: 30px; border-bottom: 1px solid #dedede; }
  header .wrapper-inter .wrapper-menu .menu-wrap .menu-group .text { padding: 10px 0; line-height: 1; border-bottom: 1px solid #dedede; } }
.visual { width: 100%; }
.visual .swiper-wrapper .swiper-slide { display: flex; justify-content: center; }
.visual .swiper-wrapper .swiper-slide img { width: 100%; max-width: 950px; }
.visual .ui { position: absolute; bottom: 0; left: 0; height: 80px; background: #fff; z-index: 10; width: 42.5%; display: flex; justify-content: flex-end; }
.visual .ui div { width: 80px; height: 80px; text-align: center; line-height: 80px; font-size: 20px; color: #454545; }
.visual .ui div.swiper-button-next { background: url("../_images/common/icon-s-caret-right@2x.png") no-repeat center/36px; cursor: pointer; }
.visual .ui div.swiper-button-prev { background: url("../_images/common/icon-s-caret-left@2x.png") no-repeat center/36px; cursor: pointer; }

.main-contents { width: 100%; max-width: 1180px; margin: 0 auto; display: flex; justify-content: space-between; margin-top: 100px; padding-bottom: 80px; }
.main-contents > div { width: calc((100% - 60px) / 3); }
.main-contents .app-store { display: flex; justify-content: space-between; margin-top: 10px; }
.main-contents .app-store a { width: calc((100% - 10px) / 2); }
.main-contents .main-board .board-top { font-size: 20px; font-weight: 700; display: flex; justify-content: space-between; border-bottom: 1px solid #dedede; padding-bottom: 12px; }
.main-contents .main-board .board-top a { font-size: 14px; padding-right: 25px; background: url("../_images/common/icon-s-caret-plus@2x.png") no-repeat center right/20px; line-height: 20px; }
.main-contents .main-board ul { padding-top: 10px; }
.main-contents .main-board ul li { margin-top: 15px; font-size: 16px; line-height: normal; width: 100%; white-space: nowrap; word-break: break-all; overflow: hidden; text-overflow: ellipsis; }

@media screen and (max-width: 960px) { .visual { padding-bottom: 80px; }
  .visual .ui { width: 100%; justify-content: center; }
  .main-contents { display: block; justify-content: space-between; margin-top: 0; padding-bottom: 60px; }
  .main-contents > div { width: 100%; }
  .main-contents .main-board { padding: 0 15px; }
  .main-contents .main-board .board-top { margin-top: 30px; font-size: 20px; font-weight: 700; display: flex; justify-content: space-between; border-bottom: 1px solid #dedede; padding-bottom: 12px; }
  .main-contents .main-board .board-top a { font-size: 14px; padding-right: 25px; background: url("../_images/common/icon-s-caret-plus@2x.png") no-repeat center right/20px; line-height: 20px; }
  .main-contents .main-board ul { padding-top: 10px; }
  .main-contents .main-board ul li { margin-top: 15px; font-size: 16px; line-height: normal; width: 100%; white-space: nowrap; word-break: break-all; overflow: hidden; text-overflow: ellipsis; } }

/*
.popupContainer{position:fixed;top:0;left:0;right:0;height:100%;padding:120px 0;background:rgba(0,0,0,.8);z-index:11;overflow-y:auto}
.popup{position:relative;top:0;left:50%;width:640px;margin-left:-320px}
.popup.w740{width:740px;margin-left:-370px}
.popup .popCon{background:#fff;position:relative}
.popup .popCon .popLink{position:absolute;top:1115px;left:50%;margin-left:-290px;width:590px;height:55px;text-indent:-9999px;overflow:hidden} */ /* 20210910 ���� */
/*
.popup .close{position:absolute;top:0;right:0;width:60px;height:60px;overflow:hidden;text-indent:-9999px;background:url(../_images/common/ico_close_w.png) 50% 50% no-repeat}
.popup .close.white{background-image:url(../_images/common/ico_close_w.png)}
*/

.popupContainer{position:fixed;top:0;left:0;right:0;height:100%;padding:120px 0;background:rgba(0,0,0,.8);z-index:11;overflow-y:auto}
.popup{position:relative;top:0;left:50%;width:400px;margin-left:-200px}
.popup.w740{width:740px;margin-left:-370px}
.popup .popCon{background:#fff;position:relative}
.popup .popCon .popLink{position:absolute;top:1115px;left:50%;margin-left:-290px;width:590px;height:55px;text-indent:-9999px;overflow:hidden} /* 20210910 ���� */
.popup .close{position:absolute;top:0;right:0;width:60px;height:60px;overflow:hidden;text-indent:-9999px;background:url(../_images/common/ico_close_w.png) 50% 50% no-repeat}
.popup .close.white{background-image:url(../_images/common/ico_close_w.png)}

.popup .close.black {
  background: url(../_images/common/ico_close.png) 50% 50% no-repeat;
}