:root {
  --head-text-color:#FFD272;
  --default-text-color:#fff;
  --default-bg-color:#000;
  --default-font-family:'Noto Serif JP', serif;
}
.sp{display:none;} 

#thanks main{background: url(../img/common/bg.png);
padding-bottom: 10px;}


#thanks *{
  font-family: var(--default-font-family);
}

.message--section--stage h2{ width: 70vw; color: #fff; border-bottom: #fff solid 6px; font-size: 4.5vw;}
.message--section--stage::after{background: rgba(0,0,0,0.6);}
.message--section--stage::before{color: #7e7e7e;content: 'THANKS';}
.message--section--logo img{filter: drop-shadow(0px 0px 3px #000);}
#thanks nav ul li a.nav--thanks {
  border-bottom-width: 4px;
}


#thanks p.text--medium{font-size: 20px; margin-top:60px;}

#thanks ul.content__list{display: flex; margin: 60px auto 80px;flex-wrap: wrap; justify-content: center;}
#thanks ul.content__list li{width: 312px; height: 160px; background: #fff; margin: 15px; position: relative; border: solid 2px #c7bf84; outline: solid 5px #fff;box-shadow: 0 10px 20px 0 rgb(0 0 0 / 20%);}
#thanks ul.content__list li::after{content: ""; background: url("../img/thanks/text.jpg") no-repeat center top; width:26px; height:26px; position: absolute; bottom:10px; right: 10px;}
#thanks ul.content__list li.list__movie::after{content: ""; background: url("../img/thanks/movie.jpg") no-repeat center top; width:34px; height:24px; position: absolute; bottom:7px; right: 7px;}
#thanks ul.content__list li p{letter-spacing: 0.5px;}
#thanks ul.content__list li p.text--small{width: 100%;font-size: 14px; text-align: left; color: #5c5c5c; line-height: 21px;font-feature-settings:"palt"; font-family: "Yu Gothic" , sans-serif; border-bottom: 1px solid #ccc;
    padding-bottom: 10px; margin: 5px 20px 2px;}
#thanks ul.content__list li p.text--large{width: 100%;font-size: 18px;  text-align: left; margin: 0 20px 0;}
#thanks ul.content__list li p.text--large strong{font-size: 25px;}
#thanks ul.content__list li a{ height: 100%; width: 100%; display: flex;
    align-content: center;
    align-items: center;
    flex-wrap: wrap;}
#thanks ul.content__list li{ display: block;  transition: all .3s;
    -webkit-transition: all .3s;
    transition: all .3s;}
#thanks ul.content__list li:hover{
    opacity: 1.0;
    -webkit-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    transform: translateY(-10px);}

#thanks .modal--none{display: none;}
#thanks .modaal-container{max-width: 1200px;}
#thanks .modaal-container .modaal-content{background: #fff;max-width: 1200px;border: solid 3px #c7bf84; outline: solid 14px #fff; padding: 50px;}
#thanks .modaal-container p.text--main{font-size: 18px; margin-top:30px;}
#thanks .modaal-container p.text--main2{font-size: 30px; margin-top:30px;}
#thanks .modaal-container p.text--small{font-size: 20px; }
#thanks .modaal-container p.text--large{font-size:40px; border-bottom: #000 solid 6px;position: relative;
    display: inline;    padding-bottom: 7px;}
#thanks .modaal-container p.text--large strong{font-size:58px;}
#thanks .modaal-container p.text--large::after {
    content: '';
    position: absolute;
    background: #d00;
    width: 5vw;
    height: 6px;
    bottom: -6px;
    left: 0;
}
#thanks .modaal-container p.img--photo{float:right;margin: 0 0 15px 20px;max-width: 404px; width: 30vw;}
#thanks .modaal-container p.img--photo img{width: 100%;}
#thanks .modaal-container .modaal-content-container{display: flow-root;}
#thanks .modaal-video-wrap{max-width: 1300px; margin: 0 auto;}

@media screen and (max-height: 900px){
	#thanks .modaal-video-wrap{max-width: 900px; }}


@media screen and (max-width:1300px){

#thanks .modaal-container p.text--main2{font-size: 2.3vw; margin-top:30px;}
}



@media screen and (max-width:768px){
.sp{display:block;} 
.pc{display:none;} 
	
.message--section--stage h2{
    font-size: 6vw;
    bottom: 4vw;    width: 85vw;
    letter-spacing: 0em;border-bottom-width: 4px;
}

.message--section--stage h2::after{    height: 4px;
    bottom: -4px;}


#thanks p.text--medium{font-size: 4vw; line-height: 6vw; margin-top:6vw;}
	
#thanks ul.content__list{margin: 5vw auto 5vw;}
#thanks ul.content__list li{width:42vw; height: 39vw; margin:2vw;  border: solid 2px #c7bf84; outline: solid 3px #fff;}
#thanks ul.content__list li::after{width:5vw; height:5vw; position: absolute; bottom:2vw; right: 2vw; background-size: 5vw;}
#thanks ul.content__list li.list__movie::after{ width:6vw; height:4.5vw; position: absolute; bottom:1vw; right: 1vw;background-size:6vw 4.5vw ;}
#thanks ul.content__list li p{letter-spacing: 0.5px;}
#thanks ul.content__list li p.text--small{font-size: 3vw; line-height: 4vw; padding-bottom:2vw; margin:0 3vw 2vw;}
#thanks ul.content__list li p.text--large{font-size: 4vw; line-height: 5vw; margin: 0 3vw 0;}
#thanks ul.content__list li p.text--large strong{font-size: 5vw;}

#thanks .modaal-inner-wrapper{padding:0 0 5vw 0;}	
#thanks .modaal-container{padding: 0; background: none;}
#thanks .modaal-container .modaal-content{max-width: 90vw; margin: 0 auto; border: solid 1vw #c7bf84; outline: solid 2vw #fff; padding: 5vw; margin-top: 5vw;}
#thanks .modaal-container p.text--main{font-size: 3.5vw; line-height: 6vw;margin-top:5vw;}
#thanks .modaal-container p.text--main2{font-size: 4.5vw; line-height: 8vw;margin-top:5vw;}
#thanks .modaal-container p.text--small{font-size:4vw;  margin-top:5vw;}
#thanks .modaal-container p.text--large{font-size:6vw; border-bottom: #000 solid 1.5vw;position: relative;
    display: inline;   padding-bottom: 7px;}
#thanks .modaal-container p.text--large strong{font-size:8vw;}
#thanks .modaal-container p.text--large::after {
    content: '';
    position: absolute;
    background: #d00;
    width: 10vw;
        height: 1.2vw;
    bottom: -1.4vw;
    left: 0;
}
#thanks .modaal-container p.img--photo{float:none;margin: 0 auto;width:100%; max-width: inherit;}	
	
.modaal-fullscreen .modaal-close, .modaal-wrapper .modaal-close {background: rgba(0,0,0,0.7);}	
	
}
