/*contents*/
#contents {
 width: 100%;
 margin: 0 auto;
 padding: 50px 0 0;
 position: relative;
 background-image: url("../img/underlayer/bg_line01.png"),url("../img/underlayer/bg_line02.png");
 background-position: top center,bottom center;
 background-repeat: no-repeat;
 background-size: 100% auto;
}
#contents .contents_wrap {
 width: 100%;
 max-width: 1050px;
 margin: 0 auto;
 background-color: rgba(255,255,255,0.6);
 box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.2);
}
#contents .contents_inner {
 -webkit-backdrop-filter: blur(20px);
	backdrop-filter: blur(20px);
 padding: 75px 75px 100px 75px;
}
#contents .sns_wrap {
 border-top: 1px solid #000;
 margin: 90px auto 0;
}
#contents .sns_inner {
 padding-top: 50px;
}
#contents .sns_wrap h2 {
 font-size: 28px;
 font-family: "Roboto", sans-serif;
 font-weight: 900;
 font-style: italic;
 letter-spacing: 0.05em;
 margin-bottom: 18px;
 text-align: center;
}
#contents .btn_snswrap {
 display: flex;
 justify-content: center;
 align-items: center;
 gap: 30px;
}
#contents .btn_snswrap li {
 width: 40px;
}
#contents .btn_snswrap li .sns_x img {
 padding: 2px
}
#contents .btn_more {
 width: 320px;
 margin: 40px auto 0;
}
#contents .btn_more a {
 color: #FFF;
 text-align: center;
 font-size: 20px;
 font-family: "Zen Kaku Gothic New", sans-serif;
 font-weight: 400;
 letter-spacing: -0.05em;
 padding: 20px 35px 20px 15px;
 display: block;
 background-color: #000;
 border-radius: 999px;
 background-image: url("../img/common/ico_arrow_R_wh.svg");
 background-position: right 20px center;
 background-size: 35px 35px;
 background-repeat: no-repeat;
}
@media (max-width: 768px) {
#contents {
 padding: 0;
 position: relative;
 background-image: url("../img/underlayer/bg_line01_SP.png"),url("../img/underlayer/bg_line02_SP.png");
 background-position: top center,bottom center;
 background-repeat: no-repeat;
 background-size: 100% auto;
}
#contents .contents_wrap {
}
#contents .contents_inner {
 padding: 25px 20px 70px 20px;
}
#contents .sns_wrap {
}
#contents .sns_inner {
}
#contents .sns_wrap h2 {
 font-size: 22px;
}
#contents .btn_snswrap {
 display: flex;
 justify-content: center;
 align-items: center;
 gap: 30px;
}
#contents .btn_snswrap li {
 width: 33px;
}
#contents .btn_snswrap li .sns_x img {
 padding: 2px
}
#contents .btn_more {
 width: 300px;
 margin: 30px auto 0;
}
#contents .btn_more a {
 color: #FFF;
 text-align: center;
 font-size: 18px;
 padding: 20px 35px 20px 15px;
 background-position: right 20px center;
 background-size: 30px 30px;
}
}

/*modal*/
body.modal_lock{
 overflow:hidden;
}
.modal_mov {
 width: 100vw;
 height: 100vh;
 position: fixed;
 top: 0;
 left: 0;
 z-index: 1000;
 display: none;
}
.modal_mov.show {
 display: block;
}
.modal_mov .bg {
 width: 100%;
 height: 100%;
 position: absolute;
 top: 0;
 left: 0;
 background: rgba(0, 0, 0, .9);
 z-index: 0;
}
.modal_mov .mov_wraaper {
 width: 90%;
 max-width: 900px;
 margin: 0 auto;
 overflow-x: hidden;
 overflow-y: auto;
 position: relative;
 pointer-events: none;
}
.modal_mov .mov_inner {
 height: 900px;
 margin: calc(50vh - 300px) auto 0 auto;
 position: relative;
 pointer-events: none;
}
.modal_mov .btn_close_wrap {
 width: 30px;
 height: 30px;
 display: block;
 position: absolute;
 top: 0;
 right: 0;
 pointer-events: all;
}
.modal_mov .btn_close_wrap button {
 width: 100%;
 height: 100%;
 background-image: url("../img/common/btn_close.svg");
 background-position: 0 0;
 background-size: 100% auto;
 background-repeat: no-repeat;
}
.modal_mov .mov_ttl {
 color: #FFF;
 text-align: center;
 font-size: 26px;
 line-height: 1.33;
 font-family: "Zen Kaku Gothic New", sans-serif;
 font-weight: 700;
 letter-spacing: 0.1em;
 margin-bottom: 15px;
}
.modal_mov .mov_frame {
 width: 100%;
 aspect-ratio: 16 / 9;
 margin: 0 auto;
}
.modal_mov .mov_frame iframe {
 width: 100%;
 height: 100%;
 pointer-events: all;
}
.modal_mov .mov_thumb_inner {
 max-width: 580px;
 margin: 30px auto;
 pointer-events: all;
}
.modal_mov .mov_thumb_inner ul {
 width: 100%;
 margin: 0 auto;
 display: flex;
 align-items: center;
 justify-content: space-between;
}
.modal_mov .mov_thumb_inner ul li {
 width: 30%;
 margin: 0 auto;
 text-align: center;
}
.modal_mov .mov_thumb_inner ul li a .thumb_img.active {
 border: 4px solid #FFF;
 box-sizing: border-box;
}
.modal_mov .mov_thumb_inner ul li a .thumb_cap {
 color: #FFF;
 text-align: center;
 font-size: 20px;
 line-height: 1.33;
 font-family: "Zen Kaku Gothic New", sans-serif;
 font-weight: 700;
 letter-spacing: 0.1em;
}
.modal_mov .mov_thumb_inner ul li a .thumb_cap span {
 font-size: 0.7em;
}
@media (max-width: 768px) {
.modal_mov .mov_wraaper {
 width: 100%;
}
.modal_mov .mov_inner {
 height: 100%;
 margin: 0 auto;
 position: relative;
 padding: 35% 0 60px;
}
.modal_mov .btn_close_wrap {
 width: 25px;
 height: 25px;
 top: unset;
 bottom: 0;
 right: calc(50% - 12.5px);
}
.modal_mov .mov_ttl {
 font-size: 16px;
 line-height: 1.33;
 margin-bottom: 15px;
}
.modal_mov .mov_frame {
 width: 100%;
 aspect-ratio: 16 / 9;
 margin: 0 auto;
}
.modal_mov .mov_frame iframe {
 width: 100%;
 height: 100%
}
.modal_mov .mov_thumb_inner {
 max-width: 90%;
 margin: 30px auto 0;
}
.modal_mov .mov_thumb_inner ul {
 width: 100%;
 margin: 0 auto;
 display: flex;
 align-items: center;
 justify-content: space-between;
}
.modal_mov .mov_thumb_inner ul li {
 width: 30%;
 margin: 0 auto;
 text-align: center;
}
.modal_mov .mov_thumb_inner ul li a .thumb_img.active {
 border: 2px solid #FFF;
 box-sizing: border-box;
}
.modal_mov .mov_thumb_inner ul li a .thumb_cap {
 font-size: 15px;
}
}
@media (orientation: landscape) and (max-width: 768px) {
 .modal_mov.show{
 position:fixed;
 inset:0;
 display:flex;
 align-items:center;
 justify-content:center;
}

.modal_mov .mov_wraaper{
 max-height:100vh;
 overflow-y:auto;
 -webkit-overflow-scrolling:touch;
 width: 100%;
}
.modal_mov .mov_inner {
 width: 100%;
 height: 100%;
 margin: 0 auto;
 position: relative;
 padding: 20px 0 60px;
}
.modal_mov .btn_close_wrap {
 width: 25px;
 height: 25px;
 top: 20px;
 bottom: unset;
 right: 20px;
}
.modal_mov .mov_ttl {
 font-size: 16px;
 line-height: 1.33;
 margin-bottom: 15px;
}
.modal_mov .mov_frame {
 width: 60%;
 aspect-ratio: 16 / 9;
 margin: 0 auto;
}
.modal_mov .mov_frame iframe {
 width: 100%;
 height: 100%
}
.modal_mov .mov_thumb_inner {
 max-width: 60%;
 margin: 30px auto 0;
}
.modal_mov .mov_thumb_inner ul {
 width: 100%;
 margin: 0 auto;
 display: flex;
 align-items: center;
 justify-content: space-between;
}
.modal_mov .mov_thumb_inner ul li {
 width: 30%;
 margin: 0 auto;
 text-align: center;
}
.modal_mov .mov_thumb_inner ul li a .thumb_img.active {
 border: 2px solid #FFF;
 box-sizing: border-box;
}
.modal_mov .mov_thumb_inner ul li a .thumb_cap {
 font-size: 15px;
}
}