@charset "UTF-8";
body { font-feature-settings: "palt"; font-family: "游ゴシック", "Yu Gothic", "游ゴシック体", YuGothic, sans-serif; font-weight: medium; overflow-x: hidden; }

.brsp { display: none; }

@media only screen and (min-width: 1200px) { .brsp { display: none; } }

@media only screen and (max-width: 750px) { .brsp { display: block; } }

.size_pc { display: block; }

@media only screen and (min-width: 1200px) { .size_pc { display: block; } }

@media only screen and (max-width: 750px) { .size_pc { display: none !important; } }

.mv { width: 100%; }

.mv .mvpc { width: 100%; }

@media only screen and (max-width: 750px) { .mv .mvpc { display: none; } }

.mv .mvsp { width: 100%; display: none; }

@media only screen and (max-width: 750px) { .mv .mvsp { display: block; } }

.read { width: 100%; margin-top: 7.5vw; margin-bottom: 11.6vw; display: flex; justify-content: center; text-align: center; line-height: 2; font-size: 1.83vw; }

@media only screen and (min-width: 1200px) { .read { font-size: 22px; margin-top: 90px; margin-bottom: 140px; } }

@media only screen and (max-width: 750px) { .read { margin-top: 20vw; margin-bottom: 20vw; font-size: 3.73vw; } }

.movie_containar { width: 83.3vw; margin-right: auto; margin-bottom: 5vw; margin-left: auto; }

@media only screen and (min-width: 1200px) { .movie_containar { width: 1000px; margin-bottom: 60px; } }

@media only screen and (max-width: 750px) { .movie_containar { width: 100%; margin-bottom: 10vw; } }

.movie_containar .movie_wrap { position: relative; width: 100%; padding: calc(315 / 560 * 100%) 0 0; margin-bottom: 4.1vw; }

.movie_containar .movie_wrap iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

section { width: 83.3vw; margin-right: auto; margin-bottom: 16.6vw; margin-left: auto; }

@media only screen and (min-width: 1200px) { section { width: 1000px; margin-bottom: 200px; } }

@media only screen and (max-width: 750px) { section { width: 80vw; } }

section ul { display: flex; justify-content: space-between; }

@media only screen and (max-width: 750px) { section ul { justify-content: inherit; flex-direction: column; } }

section ul li { width: 40vw; }

@media only screen and (min-width: 1200px) { section ul li { width: 480px; } }

@media only screen and (max-width: 750px) { section ul li { width: 100%; } }

section ul li img { width: 100%; }

.containar_1 ul li:last-of-type { margin-top: auto; }

@media only screen and (max-width: 750px) { .containar_1 ul li:last-of-type { margin-top: 8vw; } }

.containar_2 ul:first-of-type { position: relative; margin-bottom: 40px; }

@media only screen and (min-width: 1200px) { .containar_2 ul:first-of-type { margin-bottom: 3.33vw; } }

@media only screen and (max-width: 750px) { .containar_2 ul:first-of-type { flex-direction: column-reverse; margin-bottom: 0; } }

.containar_2 ul:first-of-type li:first-of-type { position: absolute; top: 78%; left: 0; }

@media only screen and (min-width: 1200px) { .containar_2 ul:first-of-type li:first-of-type { top: 520px; } }

@media only screen and (max-width: 750px) { .containar_2 ul:first-of-type li:first-of-type { margin-top: 5.3vw; position: relative; left: -10vw; } }

.containar_2 ul:first-of-type li:last-of-type { margin-left: auto; }

@media only screen and (max-width: 750px) { .containar_2 ul:first-of-type li:last-of-type { position: relative; } }

@media only screen and (max-width: 750px) { .containar_2 ul:last-of-type { flex-direction: column-reverse; } }

.containar_2 ul:last-of-type li:first-of-type { margin-top: auto; }

@media only screen and (max-width: 750px) { .containar_2 ul:last-of-type li:first-of-type { margin-top: 8vw; } }

@media only screen and (max-width: 750px) { .containar_2 ul:last-of-type li:last-of-type { margin-top: 5.3vw; position: relative; right: -10vwvw; } }

@media only screen and (max-width: 750px) { .containar_3 ul { flex-direction: column-reverse; } }

.containar_3 ul li:first-of-type { margin-top: auto; }

@media only screen and (max-width: 750px) { .containar_3 ul li:first-of-type { margin-top: 8vw; } }

.containar_4 ul:first-of-type { position: relative; }

@media only screen and (max-width: 750px) { .containar_4 ul:first-of-type li:first-of-type { position: relative; left: -10vw; } }

.containar_4 ul:first-of-type li:last-of-type { position: absolute; right: 0; bottom: -17vw; }

@media only screen and (min-width: 1200px) { .containar_4 ul:first-of-type li:last-of-type { bottom: -205px; } }

@media only screen and (max-width: 750px) { .containar_4 ul:first-of-type li:last-of-type { position: relative; bottom: 0; right: -10vw; margin-top: 5.3vw; } }

.containar_4 ul:last-of-type { margin-top: 3.33vw; }

@media only screen and (min-width: 1200px) { .containar_4 ul:last-of-type { margin-top: 40px; } }

@media only screen and (max-width: 750px) { .containar_4 ul:last-of-type { margin-top: 8vw; } }

.containar_5 ul { width: 48%; flex-direction: column; justify-content: inherit; margin-right: auto; margin-left: auto; }

@media only screen and (max-width: 750px) { .containar_5 ul { width: 80vw; } }

.containar_5 ul .credit { margin-top: 3.33vw; }

@media only screen and (min-width: 1200px) { .containar_5 ul .credit { margin-top: 40px; } }

@media only screen and (max-width: 750px) { .containar_5 ul .credit { width: 100%; margin-top: 8vw; } }

.containar_6 ul:first-of-type { position: relative; }

@media only screen and (max-width: 750px) { .containar_6 ul:first-of-type { flex-direction: column-reverse; } }

.containar_6 ul:first-of-type li:first-of-type { position: absolute; bottom: -16.6vw; left: 0; }

@media only screen and (min-width: 1200px) { .containar_6 ul:first-of-type li:first-of-type { bottom: -200px; } }

@media only screen and (max-width: 750px) { .containar_6 ul:first-of-type li:first-of-type { position: relative; left: -10vw; bottom: 0px; } }

.containar_6 ul:first-of-type li:last-of-type { margin-left: auto; }

@media only screen and (max-width: 750px) { .containar_6 ul:first-of-type li:last-of-type { position: relative; left: 10vw; margin-bottom: 5.3vw; } }

.containar_6 .credit { margin-top: 3.33vw; margin-left: auto; }

@media only screen and (min-width: 1200px) { .containar_6 .credit { margin-top: 40px; } }

@media only screen and (max-width: 750px) { .containar_6 .credit { margin-top: 8vw; } }

.containar_7 ul li:first-of-type { margin-bottom: 0vw; }

@media only screen and (min-width: 1200px) { .containar_7 ul li:first-of-type { margin-bottom: 0; } }

@media only screen and (max-width: 750px) { .containar_7 ul li:first-of-type { margin-bottom: 5.3vw; } }

.containar_7 .credit { margin-top: 3.33vw; }

@media only screen and (min-width: 1200px) { .containar_7 .credit { margin-top: 40px; } }

@media only screen and (max-width: 750px) { .containar_7 .credit { margin-top: 8vw; } }

.containar_8 ul { width: 48%; flex-direction: column; justify-content: inherit; margin-right: auto; margin-left: auto; }

@media only screen and (max-width: 750px) { .containar_8 ul { width: 100%; } }

.containar_8 ul .credit { margin-top: 3.33vw; }

@media only screen and (min-width: 1200px) { .containar_8 ul .credit { margin-top: 40px; } }

@media only screen and (max-width: 750px) { .containar_8 ul .credit { margin-top: 8vw; } }

.containar_9 .credit { margin-top: auto; }

@media only screen and (max-width: 750px) { .containar_9 .credit { margin-top: 8vw; } }

.credit { width: 36.6vw; }

@media only screen and (min-width: 1200px) { .credit { width: 440px; } }

@media only screen and (max-width: 750px) { .credit { width: 100%; } }

.credit dl { width: 100%; display: flex; align-items: baseline; }

@media only screen and (max-width: 750px) { .credit dl { position: relative; display: block; } }

.credit dl:not(:last-of-type) { margin-bottom: 1.66vw; }

@media only screen and (min-width: 1200px) { .credit dl:not(:last-of-type) { margin-bottom: 20px; } }

@media only screen and (max-width: 750px) { .credit dl:not(:last-of-type) { margin-bottom: 5.3vw; } }

.credit dl dt { font-size: 1.33vw; }

@media only screen and (min-width: 1200px) { .credit dl dt { font-size: 16px; } }

@media only screen and (max-width: 750px) { .credit dl dt { display: inline-block; font-size: 3.73vw; width: 27vw; } }

.credit dl dd:nth-of-type(1) { margin-left: auto; font-size: 1.33vw; }

@media only screen and (min-width: 1200px) { .credit dl dd:nth-of-type(1) { font-size: 16px; } }

@media only screen and (max-width: 750px) { .credit dl dd:nth-of-type(1) { display: inline; font-size: 3.73vw; } }

.credit dl dd:nth-of-type(1) span { font-size: 10px; }

@media only screen and (min-width: 1200px) { .credit dl dd:nth-of-type(1) span { font-size: .83vw; } }

@media only screen and (max-width: 750px) { .credit dl dd:nth-of-type(1) span { display: inline; font-size: 2.1vw; } }

.credit dl dd:nth-of-type(2) { font-size: 1.16vw; }

@media only screen and (min-width: 1200px) { .credit dl dd:nth-of-type(2) { font-size: 14px; } }

@media only screen and (max-width: 750px) { .credit dl dd:nth-of-type(2) { display: inline; font-size: 3.2vw; position: absolute; top: 1%; right: 0; } }

.credit dl dd:nth-of-type(2) a { border: 1px solid #000; padding-top: .33vw; padding-right: 1.16vw; padding-bottom: .33vw; padding-left: 1.16vw; margin-right: .83vw; margin-left: 1.66vw; }

@media only screen and (min-width: 1200px) { .credit dl dd:nth-of-type(2) a { padding-top: 4px; padding-right: 14px; padding-bottom: 4px; padding-left: 14px; margin-right: 10px; margin-left: 20px; } }

@media only screen and (max-width: 750px) { .credit dl dd:nth-of-type(2) a { padding-top: .5vw; padding-right: 9.3vw; padding-bottom: .5vw; padding-left: 9.3vw; margin-right: 0px; margin-left: 4vw; } }

.credit dl dd:nth-of-type(3) { font-size: 1.16vw; }

@media only screen and (min-width: 1200px) { .credit dl dd:nth-of-type(3) { font-size: 14px; } }

@media only screen and (max-width: 750px) { .credit dl dd:nth-of-type(3) { width: 27.5vw; display: flex; justify-content: space-between; margin-top: 3.2vw; margin-left: auto; font-size: 3.2vw; } }

.scrollTop { width: 1.66vw; display: none; position: fixed; right: 2.5vw; bottom: 2.5vw; }

@media only screen and (min-width: 1200px) { .scrollTop { width: 20px; } }

@media only screen and (max-width: 750px) { .scrollTop { width: 4vw; right: 2vw; bottom: 2vw; } }

.scrollTop img { width: 100%; }

footer { margin-right: auto; margin-left: auto; }

footer .feature_list { width: 50%; display: block; margin-right: auto; margin-left: auto; position: relative; left: -.4vw; text-indent: -.4vw; padding-top: 1.6vw; padding-bottom: 1.6vw; margin-bottom: 12.5vw; text-align: center; border: 1px solid #000; box-sizing: border-box; transition: .3s; }

@media only screen and (min-width: 1200px) { footer .feature_list { width: 600px; padding-top: 20px; padding-bottom: 20px; margin-bottom: 150px; left: -0.5px; text-indent: -0.5px; } }

@media only screen and (max-width: 750px) { footer .feature_list { width: 80vw; padding-top: 2.66vw; padding-bottom: 2.66vw; margin-bottom: 37vw; } }

footer .feature_list:after { content: ""; display: flex; position: absolute; top: 1vw; left: 1vw; width: 100%; height: 100%; border-right: 1px solid #000; border-bottom: 1px solid #000; box-sizing: border-box; transition: .3s; }

@media only screen and (min-width: 1200px) { footer .feature_list:after { top: 12px; left: 12px; } }

footer .feature_list:nth-of-type(2) img { width: 100%; }

footer .feature_list p { display: inline; letter-spacing: 2px; font-size: 1.5vw; }

@media only screen and (min-width: 1200px) { footer .feature_list p { font-size: 18px; } }

@media only screen and (max-width: 750px) { footer .feature_list p { font-weight: 100; font-size: 3.7vw; font-weight: 300 !important; } }

footer .feature_list.feature_list:hover { background: black; color: #fff; transition: .3s; }

footer .feature_list.feature_list:hover:after { top: 0; left: 0; transition: .6s; }

footer .feature_list.reco_img { margin-bottom: 12.5vw; }

@media only screen and (min-width: 1200px) { footer .feature_list.reco_img { margin-bottom: 150px; } }

footer ul { display: flex; justify-content: space-between; }

footer .sns_box { width: 20vw; margin-right: auto; margin-left: auto; margin-bottom: 2.5vw; }

@media only screen and (min-width: 1200px) { footer .sns_box { width: 240px; margin-bottom: 30px; } }

@media only screen and (max-width: 750px) { footer .sns_box { width: 56vw; } }

footer .sns_box li { width: 3.3vw; }

@media only screen and (min-width: 1200px) { footer .sns_box li { width: 40px; } }

@media only screen and (max-width: 750px) { footer .sns_box li { width: 8vw; margin-bottom: 13.3vw; } }

footer .sns_box li a { width: 100%; }

footer .sns_box li a img { width: 100%; }

footer .brand_box { width: 46.6vw; margin-right: auto; margin-left: auto; margin-bottom: 3.3vw; }

@media only screen and (min-width: 1200px) { footer .brand_box { width: 560px; margin-bottom: 40px; } }

@media only screen and (max-width: 750px) { footer .brand_box { width: 60vw; display: flex; flex-direction: column; } }

footer .brand_box li { width: 20.5vw; }

@media only screen and (min-width: 1200px) { footer .brand_box li { width: 246px; } }

@media only screen and (max-width: 750px) { footer .brand_box li { width: 100%; } }

footer .brand_box li a { width: 100%; }

footer .brand_box li a img { width: 100%; }

@media only screen and (max-width: 750px) { footer .brand_box li:first-of-type { margin-bottom: 5.3vw; } }

footer .c { padding-bottom: 16.6vw; text-align: center; font-size: .9vw; }

@media only screen and (min-width: 1200px) { footer .c { font-size: 11px; padding-bottom: 200px; } }

@media only screen and (max-width: 750px) { footer .c { margin-top: 6.6vw; font-size: 2.53vw; } }
