@charset "UTF-8";

header {z-index:1003 !important;}
/* sub visual */
.wrap-sub-visual{position: relative; display: table; width: 100%; height: 600px; z-index: 1002;}
.wrap-sub-visual.none,
.wrap-sub-visual.m1,
.wrap-sub-visual.m8{background: url(../../images/sub/sub_visual.jpg) no-repeat center center / cover;}
.wrap-sub-visual.m2,
.wrap-sub-visual.m9{background: url(../../images/sub/sub_visual_2.jpg) no-repeat center center / cover;}
.wrap-sub-visual.m3,
.wrap-sub-visual.m10{background: url(../../images/sub/sub_visual_3.jpg) no-repeat center center / cover;}
.wrap-sub-visual.m4,
.wrap-sub-visual.m11{background: url(../../images/sub/sub_visual_4.jpg) no-repeat center center / cover;}
.wrap-sub-visual.m5,
.wrap-sub-visual.m12{background: url(../../images/sub/sub_visual_5.jpg) no-repeat center center / cover;}
.wrap-sub-visual.m6,
.wrap-sub-visual.m13{background: url(../../images/sub/sub_visual_6.jpg) no-repeat center center / cover;}
.wrap-sub-visual.m7,
.wrap-sub-visual.m14{background: url(../../images/sub/sub_visual_7.jpg) no-repeat center center / cover;}
.wrap-sub-visual .wrap-sub-cell{display: table-cell; vertical-align: middle; text-align: center; position: relative;}
.wrap-sub-visual .wrap-sub-cell > .container{max-width: 1630px; padding: 0 30px; width: 100%; margin: 0 auto; position: relative;}
.wrap-sub-visual .wrap-sub-cell .slogan{margin-top: 24px;}
.wrap-sub-visual .wrap-sub-cell .slogan-big{font-family: "SBA Medium"; font-size: 50px; color: white; display: block; text-shadow: 3px 0 7px rgba(0,0,0,.35);}
.wrap-sub-visual .wrap-sub-cell .slogan p{font-size: 16px; line-height: 25px; letter-spacing: .025em; color: white; margin-top: 5px;}
.wrap-sub-visual .page-move{position: absolute; left: 0; top: 50%; margin-top: -35px; width: 100%; height: 0;}
.wrap-sub-visual .page-move a{position: relative; display: block; width: 50px; height: 50px; border: 2px solid white; border-radius: 50%; opacity: .5;}
.wrap-sub-visual .page-move a span{font-size: 0;}
.wrap-sub-visual .page-move a.prev{float: left; }
.wrap-sub-visual .page-move a.prev::after{content:""; display: block; position: absolute; left: 18px; top: 50%; margin-top: -4px; width: 12px; height: 9px; background: url(../../images/sub/page_move_prev.png) no-repeat left center; transition: width .3s;}
.wrap-sub-visual .page-move a.next{float: right}
.wrap-sub-visual .page-move a.next::after{content:""; display: block; position: absolute; right: 18px; top: 50%; margin-top: -4px; width: 12px; height: 9px; background: url(../../images/sub/page_move_next.png) no-repeat right center; transition: width .3s;}
.wrap-sub-navi{position: absolute; left: 0; bottom: -1px; width: 100%;}
.wrap-sub-navi .container{max-width: 1600px; margin: 0 auto; width: 100%; background-color: white; display: flex; flex-wrap: wrap; justify-content: space-between; padding: 0 6px 0 33px;}
.wrap-sub-navi .sub-navi{position: relative; flex-grow: 1;}
.wrap-sub-navi .sub-navi > ul{display: flex; flex-wrap: wrap;}
.wrap-sub-navi .sub-navi > ul > li{position: relative; min-width: 250px; display: none;}
.wrap-sub-navi .sub-navi > ul > li.on{display: block;}
.wrap-sub-navi .sub-navi > ul > li.home{width: 88px; display: block;  position: relative; min-width: auto;}
.wrap-sub-navi .sub-navi > ul > li.home::after{content:""; display: block; position: absolute; width: 40px; height: 1px; background-color: #b2b2b2; right: 0; top: 50%; margin-top: -.5px;}
.wrap-sub-navi .sub-navi > ul > li.home a{height: 80px; background: url(../../images/sub/sub_home.png) no-repeat left center; display: block; text-indent: -9999px;display: block;}
.wrap-sub-navi .sub-navi > ul > li > .inner{position: relative; height: 100%;}
.wrap-sub-navi .sub-navi > ul > li > .inner::after{content:""; display: block; position: absolute; right: 0; top: 50%; margin-top: -5px; width: 1px; height: 10px; background-color: #b2b2b2;}
.wrap-sub-navi .sub-navi > ul > li > .inner.last::after{display: none;}
.wrap-sub-navi .sub-navi > ul > li > .inner > button{text-align: left; font-size: 16px; color: #515151; font-family: "SBA Light"; transition: color .3s; padding: 0 60px 0 28px; width: 100%; background-repeat: no-repeat; background-position: right 30px center; background-image: url(../../images/sub/select_arrow_black.png); position: relative; height: 100%;}
.wrap-sub-navi .sub-navi > ul > li > .inner.last > button{color: hsl(215, 100%, 53%); background-image: url(../../images/sub/select_arrow_active.png);}
.wrap-sub-navi .sub-navi .navUl{position: absolute; width: 100%; top: 100%; left: 0; overflow: hidden; max-height: 0; overflow-y: auto;}
.wrap-sub-navi .sub-navi .navUl.on{max-height: 261px; box-shadow: 0 0 15px rgba(0,0,0,.1); background-color: white;}
.wrap-sub-navi .sub-navi .navUl > a{color: #333333; font-size: 15px; line-height: 30px; font-family: "SBA Light"; width: 100%; display: block; padding: 12px 30px 8px; position: relative; transition: all .2s; text-align: left; background-repeat: no-repeat; background-position: right 25px center; background-color: white;}
.wrap-sub-navi .sub-navi .navUl > a[target="_blank"] span{display: inline-block; padding-right: 22px; background: url(../../images/sub/nav_blank.png) no-repeat right top 7px;}
.wrap-sub-navi .sub-navi .navUl > a._active[target="_blank"] span,
.wrap-sub-navi .sub-navi .navUl > a[target="_blank"]:hover span{background: url(../../images/sub/nav_blank_hover.png) no-repeat right top 7px;}
.wrap-sub-navi .sub-util{position: relative;}
.wrap-sub-navi .sub-util > ul{display: flex;}
.wrap-sub-navi .sub-util > ul > li{position: relative;}
.wrap-sub-navi .sub-util > ul > li::before{content:""; display: block; position: absolute; right: 0; top: 50%; width: 1px; height: 10px; margin-top: -5px; background-color: #b2b2b2;}
.wrap-sub-navi .sub-util > ul > li:last-child::before{display: none;}
.wrap-sub-navi .sub-util > ul > li > button{width: 75px; height: 80px; text-indent: -9999px;}
.wrap-sub-navi .sub-util .box-sub-favo{opacity: 0; overflow: hidden; position: absolute; border: 1px solid #cacaca; right: -50px; top: 100%; width: 260px; background-color: #fff; transition: all .5s; max-height: 0; visibility: hidden;}
.wrap-sub-navi .sub-util .box-sub-favo.on{opacity: 1; max-height: 1000px; visibility: visible;}
.wrap-sub-navi .sub-util .box-sub-favo .title{border-bottom: 1px solid #cacaca;}
.wrap-sub-navi .sub-util .box-sub-favo > strong{display: block; font-family: "SBA Light"; color: #2a2a2a; font-size: 14px; padding: 16px 20px 12px; text-align: left;}
.wrap-sub-navi .sub-util .box-sub-favo .close{text-indent: -9999px; position: absolute; right: 0; top: 0; width: 50px; height: 50px; background: url(../../images/sub/share_exit.png) no-repeat center center;}
.wrap-sub-navi .sub-util .box-sub-favo .faviriteTitle-box{background-color: #f0f0f0; padding: 17px 0 20px}
.wrap-sub-navi .sub-util .box-sub-favo .favoriteTitle{line-height: 1;}
.wrap-sub-navi .sub-util .box-sub-favo .favoriteTitle strong{font-size: 14px; line-height: 20px; font-family: "SBA Light"; color: #464444; letter-spacing: .01em;}
.wrap-sub-navi .sub-util .box-sub-favo .add{background: #1174ff url(../../images/sub/share_more.png) no-repeat right 15px center; border-radius: 5px; color: white; font-size: 12px; font-family: "SBA Light"; padding: 8.5px 39px 6.5px 17px; margin-top: 7px;}
.wrap-sub-navi .sub-util .box-sub-favo #favoriteList li{display: flex; flex-wrap: wrap; justify-content: space-between; padding: 5.5px 19px 7.5px 21px;}
.wrap-sub-navi .sub-util .box-sub-favo #favoriteList li a{display: block;}
.wrap-sub-navi .sub-util .box-sub-favo #favoriteList li a span{display: none;}
.wrap-sub-navi .sub-util .box-sub-favo #favoriteList li a strong{font-size: 14px; color: #333333; font-family: "SBA Light";}
.wrap-sub-navi .sub-util .box-sub-favo #favoriteList li .del{width: 13px; height: 13px; text-indent: -9999px; background: url(../../images/sub/share_delete.png) no-repeat left top; margin-top: 6.5px;}
.wrap-sub-navi .sub-util .box-sub-favo .control{padding: 20px 0 19px; border-top: 1px solid #cacaca;}
.wrap-sub-navi .sub-util .box-sub-favo .control .reset{border-radius: 5px; border: 1px solid #50555d; font-size: 12px; font-family: "SBA Light"; padding: 7px 22px 5px; display: inline-block;}
.wrap-sub-navi .sub-util .box-sub-share{opacity: 0; position: absolute; right: 0; top: 100%; transition: all .5s; background-color: white; padding: 10px 0 0; border: 1px solid #cacaca; width: 60px; max-height: 0; visibility: hidden;}
.wrap-sub-navi .sub-util .box-sub-share.on{opacity: 1; max-height: 1000px; visibility: visible;}
.wrap-sub-navi .sub-util .box-sub-share li{margin-bottom: 7px;}
.wrap-sub-navi .sub-util .box-sub-share li:last-child{margin-bottom: 0;}
.wrap-sub-navi .sub-util .box-sub-share ul button{position: relative; display: block; width: 37px; height: 37px; border-radius: 50%; text-indent: -9999px; margin: 0 auto;}
.wrap-sub-navi .sub-util .box-sub-share ul button.fb{background: url(../../images/sub/fb_logo.png) no-repeat center center / cover;}
.wrap-sub-navi .sub-util .box-sub-share ul button.tw{background: url(../../images/sub/tw_logo.png) no-repeat center center / cover;}
.wrap-sub-navi .sub-util .box-sub-share ul button.insta{background: url(../../images/sub/insta_logo.png) no-repeat center center / cover;}
.wrap-sub-navi .sub-util .box-sub-share ul button.blog{background: url(../../images/sub/blog_logo.png) no-repeat center center / cover;}
.wrap-sub-navi .sub-util .box-sub-share ul button.addr{background: url(../../images/sub/url_logo.png) no-repeat center center / cover;}
.wrap-sub-navi .sub-util .box-sub-share > .close{background: #2c2d2f url(../../images/sub/share_exit_white.png) no-repeat center center; text-indent: -9999px; display: block; width: calc(100% + 2px); position: relative; left: -1px; bottom: -1px; padding: 13px 0; margin-top: 8px;}
.wrap-sub-navi .sub-util .sub-print{background: url(../../images/sub/sub_print.png) no-repeat 50% 50%;}
.wrap-sub-navi .sub-util .sub-favo{background: url(../../images/sub/sub_favo.png) no-repeat 50% 50%;}
.wrap-sub-navi .sub-util .sub-favo.on{background: url(../../images/sub/sub_favo_on.png) no-repeat 50% 50%;}
.wrap-sub-navi .sub-util .sub-share{background: url(../../images/sub/sub_share.png) no-repeat 50% 50%;}
.wrap-sub-navi .sub-util .sub-share.on{background: url(../../images/sub/sub_share_on.png) no-repeat 50% 50%;}

/* hover */
.wrap-sub-visual .page-move a:hover{opacity: 1;}
.wrap-sub-visual .page-move a.prev:hover::after,
.wrap-sub-visual .page-move a.next:hover::after{width: 47px;}
.wrap-sub-navi .sub-navi .navUl > a:hover,
.wrap-sub-navi .sub-navi .navUl > a._active{color: white; background-color: #1174ff; background-image: url(../../images/sub/sub_navi_arrow.png); background-position: right 20px center;}

@media screen and (max-width: 1660px) {
  .wrap-sub-visual .page-move{left: 20px; width: calc(100% - 40px);}
}

@media screen and (max-width: 1200px) {
  .wrap-sub-navi .container{margin: 0 40px; width: calc(100% - 80px); padding-right: 0; padding-left: 30px;}
  .wrap-sub-visual{height: 400px;}
  .wrap-sub-visual .page-move{margin-top: -24px;}
  .wrap-sub-visual .wrap-sub-cell .slogan{margin-top: 0;}
  .wrap-sub-visual .wrap-sub-cell .slogan-big{font-size: 50px;}
  .wrap-sub-visual .wrap-sub-cell .slogan p{font-size: 16px; line-height: 25px;}
  .wrap-sub-navi .sub-navi > ul{flex-wrap: nowrap;}
  .wrap-sub-navi .sub-navi > ul > li{max-width: 210px; min-width: auto; width: 100%;}
  .wrap-sub-navi .sub-navi > ul > li.home{width: 68px;}
  .wrap-sub-navi .sub-navi > ul > li.home a{height: 60px;}
  .wrap-sub-navi .sub-navi > ul > li.home::after{width: 20px;}
  .wrap-sub-navi .sub-navi > ul > li > .inner > button{font-size: 15px; background-position: right 20px center; padding: 0 60px 0 20px;}
  .wrap-sub-navi .sub-util > ul > li:first-child,
  .wrap-sub-navi .sub-util > ul > li:nth-child(2){display: none;}
  .wrap-sub-navi .sub-util > ul > li > button{width: 60px; height: 60px;}
  .wrap-sub-navi .sub-util .sub-share,
  .wrap-sub-navi .sub-util .sub-share.on{background-position: left 7px center;}
  .wrap-sub-navi .sub-navi .navUl > a{font-size: 14px; line-height: 25px; padding: 10px 20px 8px; background-position: right 20px center;}
  .wrap-sub-navi .sub-navi .navUl > a:hover,
  .wrap-sub-navi .sub-navi .navUl > a._active{background-position: right 25px center;}
  .wrap-sub-navi .sub-navi .navUl > a[target="_blank"] span{background-position: right top 5px;}
  .wrap-sub-navi .sub-navi .navUl > a._active[target="_blank"] span,
  .wrap-sub-navi .sub-navi .navUl > a[target="_blank"]:hover span{background-position: right top 5px;}
}

@media screen and (max-width: 768px) {
  .wrap-sub-navi .container{width: calc(100% - 40px); margin: 0 20px; padding: 0 0 0 14px;}
  .wrap-sub-visual{height: 290px;}
  .wrap-sub-visual .wrap-sub-cell > .container{padding: 0 20px;}
  .wrap-sub-visual .slogan{margin-top: 70px;}
  .wrap-sub-visual .wrap-sub-cell .slogan{margin-top: 10px;}
  .wrap-sub-visual .wrap-sub-cell .slogan-big{font-size: 34px;}
  .wrap-sub-visual .wrap-sub-cell .slogan p{font-size: 15px; line-height: 23px; padding: 0 100px;}
  .wrap-sub-visual .page-move{margin-top: -25px;}
  .wrap-sub-navi .sub-navi > ul{align-items: center;}
  .wrap-sub-navi .sub-navi > ul > li.home{height: 40px; width: 19px;}
  .wrap-sub-navi .sub-navi > ul > li.home::after{display: none;}
  .wrap-sub-navi .sub-navi > ul > li.home a{height: 37px; background-position: center center; width: 19px; background-size: 19px;}
  .wrap-sub-navi .sub-navi > ul > li{width: auto; flex-shrink: 0; height: 40px;}
  .wrap-sub-navi .sub-util > ul > li:nth-child(2){display: none;}
  .wrap-sub-navi .sub-util > ul > li > button{height: 40px; width: 32px;}
  .wrap-sub-navi .sub-navi > ul > li > .inner > button{padding: 0 16px 0 15px; background: none !important; font-size: 13px;}
  .wrap-sub-navi .sub-util .sub-share,
  .wrap-sub-navi .sub-util .sub-share.on{background-size: 17px; background-position: left center;}
  .wrap-sub-navi .sub-navi .navUl{width: 200px;}
  .wrap-sub-navi .sub-navi .navUl > a{padding: 5px 20px 3px 10px; background-position: right 10px center;}
  .wrap-sub-navi .sub-navi .navUl > a:hover,
  .wrap-sub-navi .sub-navi .navUl > a._active{background-position: right 8px center;}
}
/* sub visual */


.sub .wrap_contents{padding-top: 51px; overflow: hidden;}
.sub .wrap_contents .wrap-page-title{text-align: center; margin-bottom: 52px;}
.sub .wrap_contents .wrap-page-title h1{text-align: center; display: inline-block; font-size: 40px; color: #000000; font-family: "SBA Medium"; background: url(../../images/sub/title_logo.png) no-repeat top center; padding-top: 16px;}
.sub .wrap_contents > .container{max-width: 1560px; margin: 0 auto; padding: 0 30px;}

@media screen and (max-width: 1200px) {
  .sub .wrap_contents{padding-top: 50px;}
  .sub .wrap_contents .wrap-page-title{margin-bottom: 35px;}
  .sub .wrap_contents .wrap-page-title h1{font-size: 36px;}
}

@media screen and (max-width: 768px) {
  .sub .wrap_contents{padding-top: 30px;}
  .sub .wrap_contents .wrap-page-title{margin-bottom: 20px;}
  .sub .wrap_contents .wrap-page-title h1{line-height: 40px; padding: 25px 20px 0; font-size: 30px;}
  .sub .wrap_contents > .container{padding: 0 20px;}
}


.temp2 header .logo-wrap span {font-family:'HG Medium';}

.wrap-sub-navi .sub-util .box-sub-favo #favoriteList li a{width: calc(100% - 15px); text-align: left;}