/* ==========================================================================
   common
   ========================================================================== */
ul{
    list-style-type: none;
    padding: 0px;
    margin: 0px;
}
ul li{
    list-style-type: none;
}
   
.content_box{
    max-width: 1180px;
    margin: 0 auto;
    display: block;
    width: 95%;
    font-family: 'ヒラギノ角ゴ Pro W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
    position: relative;
}


@media screen and (max-width: 750px) {
    .content_box{width:95%}
}

/* ==========================================================================
   thanks
   ========================================================================== */
.page_area{
	background: #f7ebc7;
}
#thanks{
    width: 100%;
    padding-top: 3.8%;
    padding-bottom: 3.8%;
}
#thanks .inner{
    width: 83.9%;
    margin: 0 auto;
    background: #fff;
    border-radius: 22px;
    padding: 3.4% 3.8%;
    padding-bottom: 2.5%;
}
#thanks .mail .ttl{
	padding-bottom: 3.8%;
}
#thanks .mail .subttl{
    padding-bottom: 3.8%;
}
#thanks .line .ttl{
	padding-bottom: 4%;
}
#thanks .line .qr{
    width: 23.4%;
    margin: 0 auto;
	padding-bottom: 3.8%;
}
#thanks .line .subttl{
	padding-bottom: 6%;
}
#thanks .youtubettl{
    padding-bottom: 1.5%;
}
#thanks .movies{
	display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}
#thanks .movies li{
	width: 32.3%;
    margin-bottom: 2%;
}
#thanks .movies li .movie-box{
    position: relative;
    display: block;
    height: 0px;
    width: 100%;
    padding-top: 56.5%;
    margin: 0 auto;
}
#thanks .movies li .movie-box .movie{
    position: absolute;
    top: 0px;
    width: 100%;
    height: 100%;
}
#thanks .movies li .movie-box .movie iframe{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
#thanks .button{
	width: 66.1%;
    margin: 0 auto;
    margin-top: 4.2%;
}

@media screen and (max-width: 750px) {
    #thanks{
		padding-top: 4%;
        padding-bottom: 8%;
	}
	#thanks .inner{
		width: 100%;
        padding: 8% 2.9%;
        padding-bottom: 3%;
	}
	#thanks .mail .ttl{
        padding-bottom: 10%;
	}
	#thanks .mail .subttl{
        padding-bottom: 10%;
	}
	#thanks .line .ttl{
		padding-bottom: 8%;
	}
	#thanks .line .qr{
		width: 75%;
		padding-bottom: 8%;
	}
	#thanks .line .subttl{
		padding-bottom: 12%;
	}
	#thanks .youtubettl{
		padding-bottom: 1.5%;
	}
	#thanks .youtubettl{
		padding-bottom: 2.5%;
	}
	#thanks .movies li{
		width: 48.5%;
        margin-bottom: 3%;
	}
	#thanks .button{
        width: 95%;
        margin-top: 8%;
	}
}

@media screen and (min-width: 1300px) {
	#thanks{
		padding-top: 50px;
		padding-bottom: 50px;
	}
}