@media screen and (min-width: 751px) {
/* pc */
@charset "UTF-8";

:root {
    /* Colors */
    --color-red: #c1272d;
    --text-color-base: #42210b;
    --text-color-base-black: #231815;
    /* Fonts */
    --font-base: "Zen Kaku Gothic Antique", sans-serif;
    /* Layout */
    --max-width: clamp(747px, 99.6vw, 1920px);
}
img {
    -webkit-user-drag: none; /* Safari/Chromeなどのドラッグ防止 */
    pointer-events: none; /* マウス操作を完全に無効化する場合（クリックなども反応しなくなります） */
}
body {
    color: var(--text-color-base);
    font-family: var(--font-base);
    margin:0px;
}
main{
    padding:0px!important;
}
#cont_top {
    background-image: url("../assets/img/Teaser/bg_top.jpg");
    width:var(--max-width);
    height:clamp(361px, 48.1vw, 928px);
    background-size: contain;
    background-repeat: no-repeat;
    overflow:hidden;
    margin:0px auto;
}
#cont_top .cont_top_catch img {
    display: block;
    max-width: clamp(153px, 20.5vw, 395px);
    margin: 0px auto;
    padding-top: clamp(7px, 0.9vw, 18px);
    margin-bottom:-0.8em;
}
#cont_top .cont_top_text {
   position: relative;
    margin: 0px auto;
    width: clamp(222px, 29.5vw, 570px);
}
#cont_top .cont_top_text img {
    width: clamp(222px, 29.56vw, 570px);
    position: absolute;
}
#cont_top .cont_top_text img:nth-child(1) {
    top: clamp(171px, 22.8vw, 440px);

}
#cont_top .cont_top_text img:nth-child(2) {
    top: clamp(241.5px, 32vw, 620px);
    mix-blend-mode: multiply;
}
#cont_top .cont_top_text img:nth-child(3) {
    top: clamp(276.6px, 36.8vw, 710px);
}
#cont_top .cont_stamp, #content1 .cont_stamp{
    position:absolute;
    top:0px;
    height:100vh;
    margin:0px;
    padding:0px;
}

#content1 {
    position: relative;
    background-image: url("../assets/img/Teaser/encounter/bg.jpg");
    background-repeat: no-repeat;
    background-size: contain;
    width: var(--max-width);
    height: clamp(212px, 28vw, 545px);
    align-content:center;
    margin:0px auto;
}
#content1 .cont_text{
    width:fit-content;
    margin:0px auto;
    text-align:center;
    position:relative;
}

#content1 .cont_text::before {
    content: "";
    width: clamp(24.5px, 3.27vw, 63px);
    height: clamp(27px, 3.63vw, 70px);
    position: absolute;
    display: block;
    background-image: url("../assets/img/Teaser/img_deco1.png");
    background-repeat: no-repeat;
    background-size: contain;
    top:clamp(-48px, -2.5vw, -19px);
    left:clamp(-80px, -4.4vw, -31px);
}

#content1 .cont_text::after {
    content: "";
    width: clamp(44.4px, 5.91vw, 114px);
    height: clamp(40px, 5.34vw, 103px);
    position: absolute;
    display: block;
    background-image: url("../assets/img/Teaser/img_deco2.png");
    background-repeat: no-repeat;
    background-size: contain;
    right: clamp(-160px, -8.3vw, -62px);
    bottom: 0;
}

#content1 h2{
    font-weight: 700!important;
    font-size:clamp(20px, 2vw, 40px);
    line-height:clamp(29px, 3.5vw, 68px);
    color:var(--text-color-base);
    font-family:var(--font-base);
}

#content1 .cont_text p {
    line-height: clamp(17px, 2.18vw, 42px);
    max-width: clamp(261px, 35vw, 670px);
    font-size:clamp(12px, 0.9vw, 18px);
    letter-spacing:-0.05em;
    font-family:var(--font-base);
    color: var(--text-color-base);
}

#content1 .cont_text .cont_awajimusubi{
    width:clamp(30px, 4vw, 77px);
    margin: 20px auto;
    display:block;
}

#content2 {
    background-image: url("../assets/img/Teaser/bg_encounter.jpg");
    background-repeat: no-repeat;
    background-size: contain;
    background-position:center;
    width: 100%;
    padding: clamp(38.9px, 5.19vw, 100px) 0;
    background-color: #fff4f4;
}

#content2 .content2_catch img {
    width: clamp(202px, 26.97vw, 520px);
    display: block;
    margin: 20px auto 30px auto;
}

.cont_flex{
    display:flex!important;
}
.cont_flex_center {
    justify-content: center!important;
}

#content2 .cont_car_bg {
    background-image: url("../assets/img/Teaser/encounter/bg_car.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position:center;
    width:100%;
    padding-bottom:clamp(31px, 4.15vw, 80px);
    color: var(--text-color-base-black);
    gap:0px clamp(23.3px, 3vw, 60px);
}
#content2 .cont_car_bg img{
    width: clamp(139px, 18.52vw, 357px);
    display:block;
    margin:0px auto;
}
#content2 .cont_car_bg h3{
    text-align:center;
    font-size: clamp(16px, 1.3vw, 25px);
    font-weight:700!important;
    line-height:clamp(21px, 1.9vw, 37px);
    text-align:center;
    color: var(--text-color-base-black);
    position:relative;
    top:-1em;
}
#content2 .cont_car_bg p{
    width:fit-content;
    margin:0px auto;
    padding-top: 1em;
    text-align:left;
    position:relative;
    top:-1em;
}
#content2 .cont_car_bg .cont_box{
	max-width:30vw;
}
#content2 .cont_car_bg .cont_box:last-child p{
    padding-left:3em;
}
#content2 .cont_step_text {
    font-size:clamp(12px, 0.8vw, 16px);
    line-height:clamp(13px, 1.6vw, 30px);
    padding:0px;
    padding-top:clamp(17px, 2vw, 40px);
    width:fit-content;
    margin:0px auto;
    width: clamp(756.92px, 92.308vw, 1200px);
}

#content2 .cont_step {
    width: clamp(756.92px, 92.308vw, 1200px);
    margin: 0px auto;
}
#content2 .cont_step img{
    width: 100%;
}

#content3 {
    background-image: url("../assets/img/Teaser/bg_content3.jpg");
    background-size: cover;
    margin: 0 !important;
    border: 1px solid transparent;
    padding: clamp(25px, 3.11vw, 50px) 0;
    padding-top: clamp(42.5px, 5.2vw, 100px);
}

#content3 .cont_text{
    background-image: url("../assets/img/Teaser/bnr_gradeup.png");
    background-size: contain;
    background-repeat: no-repeat;
    height: clamp(213px, 26.04vw, 502px);
    width: clamp(527px, 64.37vw, 1241px);
    margin: 0 auto;
    align-content: center;
    text-align: center;
}
#content3 .cont_text strong img{
    display: block;
    width: clamp(190px, 23vw, 448px);
    margin:0px auto;

}


#content3 .cont_text p{
    font-size: clamp(13px, 1.66vw, 32px);
    font-weight:bold;
    position:relative;
    display:block;
    width:fit-content;
    margin:1em auto;
}
#content3 .cont_text p .cont_text_border{
    display:inline-block;
    position:relative;
}
#content3 .cont_text .cont_text_border:after {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 4px;
    background-color: #e9545b;
    right: 0px;
    bottom: 0px;
}
#bottom {
    background-image: url("../assets/img/Teaser/bg_campaign.jpg");
    background-size: cover;
    border: 1px solid transparent;
    align-content: center;
    text-align: center;
    padding-top: clamp(55px, 6.74vw, 130px);
    padding-bottom: clamp(76px, 9.34vw, 180px);
}
#bottom .cont_text{
    color: white;
    font-size: clamp(17px, 2.07vw, 40px);
    font-weight: bold;
}

#bottom .cont_text_bg{
    background-color: #e9545d;
    color: white;
    font-size: clamp(11px, 1.40vw, 27px);
    font-weight: bold;
    display: block;
    padding:0em 1em;
    width:fit-content;
    margin: 0 auto;
}

#bottom-menu {
    background-color: #74210b;
    color: white;
    gap: clamp(21px, 2.59vw, 50px);
    padding: clamp(25px, 3.11vw, 60px) 0;
}
.list_text-size {
    font-size: 1.1em;
}
.cont_sp {
    display: none !important;
}
}
@media screen and (max-width: 750px) {
/* sp */
@charset "UTF-8";

:root {
    /* Colors */
    --color-red: #c1272d;
    --text-color-base: #42210b;
    --text-color-base-black: #231815;
    /* Fonts */
    --font-base: "Zen Kaku Gothic Antique", sans-serif;
    /* Layout */
}
main{
    margin:0px!important;
    padding:0px!important;
}
img {
    -webkit-user-drag: none; /* Safari/Chromeなどのドラッグ防止 */
    pointer-events: none; /* マウス操作を完全に無効化する場合（クリックなども反応しなくなります） */
}

body {
    color: var(--text-color-base);
    font-family: var(--font-base);
    margin: 0px;
}

#cont_top {
    background-image: url("../assets/img/Teaser/sp/s_bg_top.jpg");
    height: clamp(638px, 177vw, 1330px);
    background-size: cover;
    background-repeat: no-repeat;
    overflow: hidden;
}

#cont_top .cont_top_catch img {
    display: block;
    width: clamp(192px, 53.3vw, 400px);
    margin: 0px auto;
    padding-top: clamp(86.4px, 24vw, 180px);
}

#cont_top .cont_top_text {
    position: relative;
    margin: 0 auto;
    width: clamp(259.2px, 72vw, 540px);
}

#cont_top .cont_top_text img {
    width: clamp(259.2px, 72vw, 540px);
    position: absolute;
}
#cont_top .cont_top_text img:nth-child(1) {
    top: clamp(192px, 53.3vw, 400px);
}
#cont_top .cont_top_text img:nth-child(2) {
    top: clamp(268.8px, 74.7vw, 560px);
    mix-blend-mode: multiply;
}
#cont_top .cont_top_text img:nth-child(3) {
    top: clamp(312px, 86.7vw, 650px);
}

#content1 .cont_stamp {
    position: relative;
    top: 0px;
    margin: 0px;
    padding: 0px;
    width: 100%;
    overflow: hidden;
}
#cont_top .cont_stamp li, #content1 .cont_stamp li {
    position: absolute;
    list-style: none;
    left:0px;
}

#cont_top .cont_stamp img, #content1 .cont_stamp img {
    position: absolute;
    width: 100vw;
}

#content1 .cont_stamp {
    position: relative;
    top: 0px;
    margin: 0px;
    padding: 0px;
    width: 100%;
    overflow: hidden;
}
#cont_top .cont_stamp li, #content1 .cont_stamp li {
    position: absolute;
    list-style: none;
}

#cont_top .cont_stamp img, #content1 .cont_stamp img {
    position: absolute;
    width: 100vw;
}

#cont_top .cont_stamp li:nth-child(9) {
    top: clamp(489.6px, 136vw, 1020px);
}

#cont_top .cont_stamp li:nth-child(10) {
    top: clamp(465.6px, 129.333vw, 970px);
}

#content1 {
    position: relative;
    padding-top: clamp(19.2px, 5.3vw, 40px);
}
#content1 .cont_stamp {
    margin-top: 1em;
    width:100%;
    padding-top:clamp(14.4px, 4vw, 30px);
}

#content1 .cont_text {
    width: fit-content;
    margin: 0px auto;
    padding-top: clamp(38.4px, 10.7vw, 80px);
    text-align: center;
    position: relative;
}

#content1 .cont_text::before {
    content: "";
    width: clamp(43.68px, 12.133vw, 91px);
    height: clamp(48.96px, 13.6vw, 102px);
    position: absolute;
    display: block;
    background-image: url("../assets/img/Teaser/img_deco1.png");
    background-repeat: no-repeat;
    background-size: contain;
    top: clamp(-20px, -2.667vw, -9.6px);
    left: clamp(-20px, -2.667vw, -9.6px);
}

#content1 .cont_text::after {
    content: "";
    width: clamp(54.72px, 15.2vw, 114px);
    height: clamp(49.44px, 13.733vw, 103px);
    position: absolute;
    display: block;
    background-image: url("../assets/img/Teaser/img_deco2.png");
    background-repeat: no-repeat;
    background-size: contain;
    right: clamp(-50px, -6.7vw, -24px);
    top: clamp(72px, 20vw, 150px);
}

#content1 h2 {
    font-weight: bold;
    font-size: clamp(19.2px, 5.333vw, 40px);
    font-family:var(--font-base);
    color:var(--text-color-base);
    font-weight:700!important;
}

#content1 .cont_text p {
    font-size: clamp(13.44px, 3.733vw, 28px);
    line-height: clamp(27.36px, 7.6vw, 57px);
    font-weight: 500;
    width: clamp(299.04px, 83.067vw, 623px);
    text-align: left;
    margin: 0 auto;
    font-family:var(--font-base);
    color:var(--text-color-base);
}

.cont_awajimusubi {
    width: clamp(42.24px, 11.733vw, 88px);
    height: auto;
    margin: clamp(14.4px, 4vw, 30px) 0px!important;
}

#content2 {
    margin-top: clamp(42px, 5.19vw, 100px);
    background-color: #fff4f4;
    width: 100%;
    padding: clamp(57.6px, 16vw, 120px) 0;
}

#content2 .content2_catch img {
    width: clamp(253.44px, 70.4vw, 528px);
    display: block;
    margin: 0 auto;
}

.cont_flex {
    display: flex;
}

.cont_flex_center {
    justify-content: center;
}

.cont_sp_grid{
    display:grid;
}

#content2 .cont_car_bg {
    background-image: url("../assets/img/Teaser/sp/encounter/s_bg_car.png");
    background-size: contain;
    background-repeat: no-repeat;
    width: 100%;
    color: var(--text-color-base-black);
    margin-top: clamp(33.6px, 9.333vw, 70px);
    padding-bottom: clamp(76.8px, 21.3vw, 160px);
}

#content2 .cont_car_bg img {
    width: 100%;
    position: relative;
}


#content2 .cont_step {
    background-image: url("../assets/img/Teaser/sp/encounter/s_bg_step.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    padding-top: clamp(81.6px, 22.667vw, 170px);
    padding-bottom: clamp(14.4px, 4vw, 30px);
    width: 100%;
}

#content2 .cont_step img {
    width:clamp(258.7px, 68vw, 539px);
    display: block;
    margin: 0 auto clamp(33.6px, 9.333vw, 70px) auto;
}
#content2 .cont_step_text {
    width: 80%;
    margin: 0px auto;
}
#content3 {
    background-image: url("../assets/img/Teaser/sp/s_bg_content3.png");
    background-size: cover;
    margin: 0 !important;
    border: 1px solid transparent;
    padding: clamp(38.4px, 10.667vw, 80px) 0;
}

#content3 .cont_text {
    background-image: url("../assets/img/Teaser/sp/s_bnr_gradeup.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin: 0 auto;
    align-content: center;
    text-align: center;
    height: clamp(401.76px, 111.6vw, 837px);
    position:relative;
}

#content3 .cont_text strong img{
    display:block;
    margin:0px auto;
    width:clamp(272px, 75.5vw, 566px);
}

#content3 .cont_text strong .cont_text_big {
    font-size: clamp(22.08px, 6.133vw, 46px);
}

#content3 .cont_text p {
    font-size: clamp(16.8px, 4.667vw, 35px);
    font-weight: bold;
    position: relative;
    display: block;
    width: fit-content;
    margin: 1em auto;
    font-family:var(--font-base);
    color:var(--text-color-base);
}

#content3 .cont_text p .cont_text_border {
    display: inline-block;
    position: relative;
}

#content3 .cont_text .cont_text_border:after {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 4px;
    background-color: #e9545b;
    right: 0px;
    bottom: 0px;
}
#bottom {
    background-image: url("../assets/img/Teaser/sp/s_bg_campaign.jpg");
    background-size: cover;
    border: 1px solid transparent;
    align-content: center;
    text-align: center;
    height: clamp(168.48px, 46.8vw, 351px);
}

#bottom .cont_text {
    color: white;
    font-size: clamp(19.2px, 5.333vw, 40px);
    font-weight: bold;
}

#bottom .cont_text_bg {
    background-color: #e9545d;
    color: white;
    font-size: clamp(12.96px, 3.6vw, 27px);
    font-weight: bold;
    display: block;
    width: clamp(179.04px, 49.733vw, 373px);
    height: clamp(25.92px, 7.2vw, 54px);
    margin: 0 auto;
    align-content: center;
}

#bottom-menu {
    background-color: #74210b;
    color: white;
    gap: clamp(19.2px, 5.333vw, 40px);
    padding: clamp(28.8px, 8vw, 60px) 0;
    margin-top: clamp(4.8px, 1.333vw, 10px);
    font-size: clamp(14.4px, 4vw, 30px);
    text-align: center;
}
main .list_text-size {
    font-size: clamp(14px, 3.2vw, 24px)!important;
    font-family: var(--font-base);
    color:var(--text-color-base);
}
.cont_pc{
    display:none!important;
}

}

.cont_container .cont_notes, .cont_container .cont_inside {
    list-style: none!important;
    left: 1em!important;
    line-height: 1.8em!important;
    position: relative!important;
}

.cont_container .cont_notes::before {
    content: "※ "!important;
    position: absolute!important;
    left: -1.4em!important;
}

.cont_container .cont_inside::before {
    content: "・"!important;
    position: absolute!important;
    left: -1.4em!important;
}

.cont_container a {
    font-weight: 700 !important;
}

#content3 .cont_text p{opacity:0;}
#bottom .cont_text_bg .txt_span_1{font-size:0.8em;}
#bottom .cont_text_bg .txt_span_2{font-size:0.6em;}
.cont_bottom_border img{width:100%;}

@media screen and (min-width: 760px) and (max-width: 959px) {
	#main-content{
		margin-top: -55px;
	}
}