@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP&display=swap');

/*** all ***/

*:focus {
  outline:none;
}
html{
  font-size: 16px;
}
body{
  -webkit-text-size-adjust: 100%;
	line-height: 1.5;
  letter-spacing: 0;
}
body, .font_sans-serif{
	font-family: 'Noto Sans JP', "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif;
}

h2, h3, h4, h5, h6{
  line-height: 1.5;
}

input[type="submit"], input[type="button"] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  border: none;
  box-sizing: border-box;
  cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration, input[type="button"]::-webkit-search-decoration {
  display: none;
}
input[type="submit"]::focus, input[type="button"]::focus {
  outline-offset: -2px;
}
textarea{
  overflow: auto
}

/*---------------------------------------------------------------------------*/

#wrap{
  max-width: 562.5px;
  margin: 0 auto;
  overflow: hidden;
}

.offer1 {
	margin-top:-13%;
}

.offer2 {
	margin-top:-20%;
}

.btn {
margin-top: -38%;
    padding-bottom: 5%;	
}
.offer2 .btn {
    padding-bottom: 10%;	
}

.img3 {
	margin-top: -13%;
}

/* modal */

.modal_bt{
    cursor: pointer;
}
.modal_box{
    top: 0;
    left: 0;
    z-index: 10000;
    overflow-y: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.5s;
}
.modal_box.active{
    opacity: 1;
    pointer-events: auto;
}
.modal_box::-webkit-scrollbar{
    display:none;
}
.modal_box .modal_bg{
    top: 0;
    left: 0;
}
.modal_box .modal_close{
    cursor: pointer;
    background-color: rgba(122, 122, 122, 0.4);
	margin-left: -40px;
	position: sticky;
	top: 0;
	width: 40px;
	height: 40px;
	z-index: 1;
}
.modal_box .modal_close::before, .modal_box .modal_close::after{
	position: absolute;
	content: "";
	width: 20px;
	height: 2px;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	background-color: #fff;
}
.modal_box .modal_close::before{
	transform: rotate(45deg);
}
.modal_box .modal_close::after{
	transform: rotate(-45deg);
}
.modal_item{
	max-width: 562.5px;
}
.modal_box .dupe_box:last-of-type{
	padding-bottom: 0;
	border-bottom: none;
}

/*ここからタブレット用（780px以下）環境の設定
---------------------------------------------------------------------------*/
/*表示を切り替えるウィンドウサイズの指定*/
@media screen and (max-width: 768px){
}

/*ここからスマホ用（750px以下）環境の設定
---------------------------------------------------------------------------*/
/*表示を切り替えるウィンドウサイズの指定*/
@media screen and (max-width: 667px){
}