@charset "utf-8";

/* base
-------------------------------------------------------- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font: inherit;
	font-size: 100%;
	vertical-align: baseline;
}
article, aside, details, figcaption, figure,
footer, header, main, menu, nav, section {
	display: block;
}
html {
	line-height: 1;
}
ul, ol {
	list-style-type: none;
}
table {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
	vertical-align: middle;
}
q, blockquote {
	quotes: none;
}

q:before, q:after, blockquote:before, blockquote:after {
	content: "";
	content: none;
}
a img {
	border: none;
}
img {
	vertical-align: bottom;
	border: none;
	max-width: 100%;
	height: auto;
}
img[src*=".svg"] {
	width: 100%;
}
a {
	color: inherit;
	text-decoration: none;
}
*,
:before,
:after {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
input,
button,
select,
textarea {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	font: inherit;
	border: none;
	border-radius: 0;
	outline: none;
}
textarea {
	resize: vertical;
}
input[type='checkbox'],
input[type='radio'] {
	display: none;
}
input[type='submit'],
input[type='button'],
label,
button,
select {
	cursor: pointer;
}
select::-ms-expand {
	display: none;
}

/* --------------------------------------------------------
	フォントと背景
-------------------------------------------------------- */
html {
	font-size: 62.5%;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}
body {
	font-family: "Arial", "Noto Sans JP", sans-serif;
	color: #000;
	font-size: 1.6em;
	font-weight: 400;
	background: #fff;
	letter-spacing: 0.05em;
	line-height: 1.6;
}

/* フォント */
.ff_yakuHan { font-family: YakuHanJP, sans-serif; }
.ff_poppins { font-family: "Poppins", sans-serif; }
.bold { font-weight: 700; }
.heavy { font-weight: 900; }
.tal { text-align: left; }
.tac { text-align: center; }
.tar { text-align: right; }

@media screen and (max-width: 768px) {
body { font-size: 1.4em; }
}


/* --------------------------------------------------------
	リンク
-------------------------------------------------------- */
a {
	color: inherit;
	transition: .5s;
}
a:hover { opacity: 0.5; }
::-moz-selection {
	color: #fff;
	background: #d20012;
}
::selection {
	color: #fff;
	background: #d20012;
}

/* テキストリンク
-------------------------------------------------------- */

/* アンカーリンク
-------------------------------------------------------- */
.anchor {
	margin-top: -90px;
	padding-top: 90px;
}
@media screen and (max-width: 768px) {
.anchor {
	margin-top: -68px;
	padding-top: 68px;
}
}



/* --------------------------------------------------------
	共通
-------------------------------------------------------- */
.inner {
	max-width: 1200px;
	width: 92%;
	margin: auto;
}
.mw878 {
	max-width: 878px;
	margin: auto;
}
@media screen and (max-width: 768px) {
.inner.is_wide {
	width: 95%;
}
}

.c-frame_layout .c-frame_title {
	color: #999;
	font-size: 1.8rem;
	font-style: italic;
	font-weight: 700;
	text-align: center;
	letter-spacing: 0.1em;
}
.c-frame_layout .c-frame_title span {
	font-size: 3.5rem;
	font-weight: 700;
	display: inline-block;
	margin: 0 0 0 8px;
}
.c-frame_layout .c-frame_content {
	margin: -20px 0 0;
	padding: 20px;
	position: relative;
	z-index: 1;
}
.c-frame_layout .c-frame_content::before,
.c-frame_layout .c-frame_content::after {
	content: "";
	width: 32%;
	height: 35%;
	border: solid 2px #999;
	border-right: none;
	border-bottom: none;
	position: absolute;
	z-index: 0;
}
.c-frame_layout .c-frame_content::before {
	top: 0;
	left: 0;
}
.c-frame_layout .c-frame_content::after {
	bottom: 0;
	right: 0;
	scale: -1 -1;
}
.c-frame_layout .c-frame_content > div { padding: 40px 20px; }
@media screen and (max-width: 768px) {
.c-frame_layout .c-frame_content {
	margin: -16px 0 0;
	padding: 12px;
}
.c-frame_layout .c-frame_content::before,
.c-frame_layout .c-frame_content::after {
	border-width: 1.5px;
}
}


/* iframe */
.iframe { position: relative; }
.iframe.youtube { padding-top: 56.25%; }
.iframe iframe {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}


/* flex */
.flex {
	display: -webkit-box;
	display: flex;
	flex-wrap: wrap;
}
.nowrap { flex-wrap: nowrap; }
.fd_c {
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	flex-direction: column;
}
.fd_rr {
	-webkit-box-orient: horizontal;
	-webkit-box-direction: reverse;
	flex-direction: row-reverse;
}
.ai_fs {
	-webkit-box-align: start;
	align-items: flex-start;
}
.ai_fe {
	-webkit-box-align: end;
	align-items: flex-end;
}
.ai_c {
	-webkit-box-align: center;
	align-items: center;
}
.jc_fs {
	-webkit-box-pack: start;
	justify-content: flex-start;
}
.jc_fe {
	-webkit-box-pack: end;
	justify-content: flex-end;
}
.jc_c {
	-webkit-box-pack: center;
	justify-content: center;
}
.jc_sb {
	-webkit-box-pack: justify;
	justify-content: space-between;
}
.jc_sa {
	justify-content: space-around;
}
.order1 {
	-ms-flex-order: 1;
	-webkit-order: 1;
	order: 1;
}
.order2 {
	-ms-flex-order: 2;
	-webkit-order: 2;
	order: 2;
}

/* --------------------------------------------------------
	アニメーション
-------------------------------------------------------- */
.trigger {
	opacity: 0;
}
/* 下から上へ */
.animation.animation01 {
	animation: fadeup .8s ease forwards;
}
/* 左から右へ */
.animation.animation02 {
	animation: faderight .8s ease forwards;
}
/* 右から左へ */
.animation.animation03 {
	animation: fadeleft .8s ease forwards;
}

@keyframes fadeup{
	from {
		opacity: 0;
		transform: translateY(2em);
	}
	
	to {
		opacity: 1;
		transform: translateY(0);
	}
}
@keyframes faderight{
	from {
		opacity: 0;
		transform: translateX(-2em);
	}
	
	to {
		opacity: 1;
		transform: translateX(0);
	}
}
@keyframes fadeleft{
	from {
		opacity: 0;
		transform: translateX(2em);
	}
	
	to {
		opacity: 1;
		transform: translateX(0);
	}
}


/* --------------------------------------------------------
	title
-------------------------------------------------------- */
.en_title {
	display: -webkit-box;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	flex-direction: column;
	-webkit-box-align: center;
	align-items: center;
	text-align: center;
	margin: 0 0 40px;
}
.en_title .line {
	width: 2px;
	height: 151px;
	background: #8A8A8A;
	background: linear-gradient(0deg, rgba(138, 138, 138, 1) 0%, rgba(255, 255, 255, 1) 100%);
	margin: 0 0 10px;
}
.en_title .en {
	font-size: 2.4rem;
}
.en_title .ja {
	font-size: 4.6rem;
	font-weight: 700;
	margin: -4px 0 0;
}
.en_title.is_wh {
	color: #fff;
}
@media screen and (max-width: 768px) {
.en_title {
	margin: 0 0 24px;
}
.en_title .line {
	height: 76px;
	margin: 0 0 4px;
}
.en_title .en {
	font-size: 1.6rem;
}
.en_title .ja {
	font-size: 2.7rem;
	margin: 4px 0 0;
}
}

.dot_title {
	font-size: 2.4rem;
	font-weight: 500;
	text-align: center;
}
.dot_title::after {
	content: "";
	width: 44px;
	height: 4px;
	background: url("../img/dot_wh.svg") no-repeat;
	background-size: contain;
	display: block;
	margin: 20px auto;
}
@media screen and (max-width: 768px) {
.dot_title {
	font-size: 1.6rem;
	font-weight: 500;
	text-align: center;
}
.dot_title::after {
	width: 32px;
	height: 3px;
	margin: 10px auto;
}
}

.border_title {
	color: #fff;
	font-size: 3rem;
	font-weight: 700;
	text-align: center;
	margin: 0 0 64px;
}
.border_title span {
	display: inline-block;
	padding: 0 0 12px;
	position: relative;
}
.border_title span::after {
	content: "";
	width: 100%;
	height: 2px;
	background: #747474;
	background: linear-gradient(90deg, rgba(116, 116, 116, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(116, 116, 116, 1) 100%);
	position: absolute;
	bottom: -2px;
	left: 0;
}
@media screen and (max-width: 768px) {
.border_title {
	font-size: 1.5rem;
	margin: 0 0 40px;
}
}


/* --------------------------------------------------------
	PC SP
-------------------------------------------------------- */
.is_sp { display: none; }
@media screen and (max-width: 768px) {
	.is_pc { display: none; }
	.is_sp { display: block; }
}


/* --------------------------------------------------------
	footer
-------------------------------------------------------- */
footer {
	color: #fff;
	background: #00122e;
	padding: 150px 5.5% 48px;
}
#copyright {
	text-align: center;
	margin: 48px 0 0;
}
.fixed_btn {
	color: #fff;
	font-size: 1.8rem;
	font-weight: 700;
	width: 170px;
	height: 170px;
	background: #001028;
	background: linear-gradient(120deg, rgba(0, 16, 40, 1) 0%, rgba(0, 68, 168, 1) 50%, rgba(0, 16, 40, 1) 100%);
	border: solid 3px #fff;
	border-radius: 50%;
	box-shadow: 1.04px 4.891px 10px 0px rgba(0, 0, 0, 0.52);
	line-height: 1.8;
	text-align: center;
	position: fixed;
	left: 16px;
	bottom: 16px;
	z-index: 10;
}
.fixed_btn a {
	width: 100%;
	height: 100%;
	display: -webkit-box;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	flex-direction: column;
	-webkit-box-align: center;
	align-items: center;
	-webkit-box-pack: center;
	justify-content: center;
}
.fixed_btn a::after {
	content: "";
	width: 20px;
	height: 11px;
	background: url("../img/arrow_b_wh.svg") no-repeat;
	background-size: contain;
	position: absolute;
	left: 50%;
	bottom: 20px;
	transform: translateX(-50%);
}

@media screen and (max-width: 768px) {
footer {
	font-size: 1.1rem;
	text-align: center;
	padding: 48px 0 24px;
}
#copyright { margin: 36px 0 0; }
.fixed_btn {
	font-size: 1.4rem;
	width: 100%;
	height: auto;
	border: solid 2px #fff;
	border-right: none;
	border-left: none;
	border-radius: 0;
	padding: 16px 8px 12px;
	position: -webkit-sticky;
	position: sticky;
	left: 0;
	bottom: 0;
}
.fixed_btn a::after {
	width: 16px;
	height: 7px;
	position: static;
	bottom: 10px;
	transform: none;
}
}
@media screen and (max-width: 480px) {
footer { font-size: 2.9333vw; }
}


/* --------------------------------------------------------
	メインビジュアル
-------------------------------------------------------- */
#mv {
	display: -webkit-box;
	display: flex;
}
#mv > .img {
	width: 59.25%;
}
#mv .img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
#mv .text_wrap {
	color: #fff;
	width: 40.75%;
	background-image: url("../img/mv_bg.jpg");
	background-position: top center;
	background-repeat: no-repeat;
	background-size: cover;
	display: -webkit-box;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	flex-direction: column;
	-webkit-box-align: center;
	align-items: center;
	-webkit-box-pack: center;
	justify-content: center;
	overflow: hidden;
}
#mv .text_wrap > div {
	width: 100%;
	overflow: hidden;
}
.mv_logo {
	width: 45%;
	margin: auto;
}
.mv_title {
	font-size: 1.875vw;
	font-weight: 700;
	display: -webkit-box;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	flex-direction: column;
	-webkit-box-align: center;
	align-items: center;
	line-height: 1;
	margin: 2vw 0 1.5vw;
}
.mv_title .main {
	font-size: 4.8vw;
	margin: 2vw 0 0;
}
.mv_copy {
	font-size: 1.5vw;
	font-weight: 700;
	text-align: center;
	margin: 0 0 3vw;
}
.mv_text {
	font-size: 1.125vw;
	width: 63%;
	margin: auto;
}
.mv_en {
	font-size: 5.625vw;
	font-weight: 700;
	display: -webkit-box;
	display: flex;
	overflow: hidden;
	white-space: nowrap;
	margin: 2vw 0 0;
}
.mv_en > p {
	color: rgba(0, 0, 0, .0);
	-webkit-text-stroke: 1px #828282;
	animation: scroll-right 40s infinite linear 0.5s both;
	margin: 0 1.5vw 0 0;
}
@media screen and (max-width: 1024px) {
#mv > .img {
	display: none;
}
#mv .text_wrap {
	width: 100%;
	background-image: url("../img/mv_bg_sp.jpg");
	padding: 100px 0 24px;
}
.mv_logo {
	max-width: 345px;
	width: 100%;
}
#mv .text_wrap .img {
	display: block;
	margin: 0 0 24px;
}
.mv_title {
	font-size: 3rem;
	margin: 40px 0 24px;
}
.mv_title .main {
	font-size: 7.2rem;
	margin: 32px 0 0;
}
.mv_copy {
	font-size: 2.4rem;
	margin: 0 0 56px;
}
.mv_text {
	font-size: 1.8rem;
	width: 78%;
}
.mv_en {
	font-size: 9rem;
	margin: 8px 0 0;
}
}
@media screen and (max-width: 768px) {
#mv .text_wrap {
	padding: 40px 0 24px;
}
.mv_logo {
	max-width: 172px;
}
.mv_title {
	font-size: 2rem;
	margin: 24px 0 16px;
}
.mv_title .main {
	font-size: 3.6rem;
	margin: 20px 0 0;
}
.mv_copy {
	font-size: 1.8rem;
	margin: 0 0 32px;
}
.mv_text {
	font-size: 1.4rem;
}
.mv_en {
	font-size: 4.5rem;
	margin: 8px 0 0;
}
}
@media screen and (max-width: 480px) {
.mv_title {
	font-size: 5.3333vw;
}
.mv_title .main {
	font-size: 9.6vw;
}
.mv_copy {
	font-size: 4.8vw;
}
.mv_text {
	font-size: 3.7333vw;
}
.mv_en {
	font-size: 12vw;
}
}


/* --------------------------------------------------------
	「せかもば」は広告費を成果に変えます！
-------------------------------------------------------- */
#intro {
	padding: 104px 0 132px;
}
@media screen and (max-width: 1024px) {
#intro {
	padding: 56px 0 132px;
}
}
@media screen and (max-width: 768px) {
#intro {
	padding: 56px 0 64px;
}
}
.intro_wrap.intro01 {
	text-align: center;
}
.intro_wrap.intro01 .title_wrap {
	font-weight: 700;
	margin: 0 0 40px;
}
.intro_wrap.intro01 .title_wrap .main {
	font-size: 4rem;
}
.intro_wrap.intro01 .title_wrap .main span {
	font-size: 4.8rem;
}
.intro_wrap.intro01 .title_wrap .sub {
	font-size: 3rem;
	margin: 8px 0 0;
}
.intro_wrap.intro01 .title_wrap .sub span {
	font-size: 3.6rem;
}
.intro_wrap.intro01 .text {
	font-size: 1.8rem;
	line-height: 1.8;
	margin: 0 0 60px;
}
.intro_wrap.intro01 .list {
	display: -webkit-box;
	display: flex;
}
.intro_wrap.intro01 .list li {
	position: relative;
}
.intro_wrap.intro01 .list li:not(:nth-child(2))::after {
	content: "";
	width: min(14.7924vw, 196px);
	height: min(8.5238vw, 113px);
	background-image: url("../img/arrow_bl.svg");
	background-repeat: no-repeat;
	position: absolute;
	top: 36%;
	right: -28%;
	z-index: 3;
}
.intro_wrap.intro01 .list .label {
	width: 100%;
	text-align: center;
	position: absolute;
	top: max(-1.8113vw, -24px);
	left: 0;
	z-index: 1;
}
.intro_wrap.intro01 .list .label span {
	color: #fff;
	font-size: min(1.3584vw, 1.8rem);
	font-weight: 700;
	background: #003093;
	border: solid 2px #fff;
	border-radius: 100px;
	display: inline-block;
	padding: 10px 30px;
}
.intro_wrap.intro01 .list .img {
	border-radius: 15px;
	overflow: hidden;
	padding-top: 100%;
	position: relative;
	z-index: 0;
}
.intro_wrap.intro01 .list .img img {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	object-fit: cover;
}
.intro_wrap.intro01 .list li:nth-child(1) {
	width: 42%;
	margin: 0 8% 0 0;
}
.intro_wrap.intro01 .list li:nth-child(2) {
	width: 50%;
}
.intro_wrap.intro01 .list li:nth-child(2) .label {
	top: max(-2.2641vw, -30px);
}
.intro_wrap.intro01 .list li:nth-child(2) .label span {
	font-size: min(1.81132vw, 2.4rem);
}
@media screen and (max-width: 1024px) {
.intro_wrap.intro01 .title_wrap .main .is_sp {
	display: block;
}
.intro_wrap.intro01 .list {
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	flex-direction: column;
	-webkit-box-align: center;
	align-items: center;
}
.intro_wrap.intro01 .list li:nth-child(1) {
	width: 66.6666%;
	margin: 0 0 11%;
}
.intro_wrap.intro01 .list li:not(:nth-child(2))::after {
	width: 27.86666vw;
	height: 29.6vw;
	background-image: url("../img/arrow_bl_sp.svg");
	top: 85%;
	right: -20%;
}
.intro_wrap.intro01 .list li:nth-child(2) {
	width: 100%;
}
.intro_wrap.intro01 .list .label {
	top: -24px;
}
.intro_wrap.intro01 .list .label span {
	font-size: 1.8rem;
}
.intro_wrap.intro01 .list li:nth-child(2) .label {
	top: -30px;
}
.intro_wrap.intro01 .list li:nth-child(2) .label span {
	font-size: 2.4rem;
}
}
@media screen and (max-width: 768px) {
.intro_wrap.intro01 .title_wrap {
	margin: 0 0 16px;
}
.intro_wrap.intro01 .title_wrap .main {
	font-size: 2rem;
}
.intro_wrap.intro01 .title_wrap .main span {
	font-size: 2.4rem;
}
.intro_wrap.intro01 .title_wrap .sub {
	font-size: 1.5rem;
	margin: 16px 0 0;
}
.intro_wrap.intro01 .title_wrap .sub span {
	font-size: 1.8rem;
}
.intro_wrap.intro01 .text {
	font-size: 1.4rem;
	text-align: left;
	margin: 0 0 32px;
}
	.intro_wrap.intro01 .list .img {
		border-radius: 8px;
	}
.intro_wrap.intro01 .list .label {
	top: -20px;
}
.intro_wrap.intro01 .list .label span {
	font-size: 1.2rem;
	padding: 10px 16px;
}
.intro_wrap.intro01 .list li:nth-child(2) .label {
	top: -22px;
}
.intro_wrap.intro01 .list li:nth-child(2) .label span {
	font-size: 1.5rem;
}
}
@media screen and (max-width: 768px) {
.intro_wrap.intro01 .list .label span {
	font-size: 3.2vw;
}
.intro_wrap.intro01 .list li:nth-child(2) .label span {
	font-size: 4vw;
}
}

.intro_wrap.intro02 {
	margin: 140px 0 0;
}
.intro_wrap.intro02 .flex_wrap {
	display: -webkit-box;
	display: flex;
}
.intro_wrap.intro02 .flex_wrap .text_wrap {
	width: 49.8%;
	padding: 0 4% 0 0;
}
.intro_wrap.intro02 .flex_wrap .title {
	font-size: 3rem;
	font-weight: 700;
	line-height: 1.8;
	margin: 0 0 24px;
}
.intro_wrap.intro02 .flex_wrap .title .span01 {
	font-size: 4.2rem;
}
.intro_wrap.intro02 .flex_wrap .title .span02 {
	font-size: 3.6rem;
}
.intro_wrap.intro02 .flex_wrap .text_wrap .slide_wrap { display: none; }
.intro_wrap.intro02 .flex_wrap .text {
	font-size: 1.8rem;
	line-height: 1.8;
}
.intro_wrap.intro02 .flex_wrap > .slide_wrap {
	width: 50%;
	flex: 1 1 auto;
	margin-right: calc(50% - 50vw);
}
.intro_wrap.intro02 .swiper {
	max-width: 800px;
	margin: 0;
}
.intro_wrap.intro02 .swiper .swiper-slide {
	border-radius: 15px 0 0 15px;
	overflow: hidden;
}
.intro_wrap.intro02 .swiper .swiper-pagination {
	margin: 10px 0 0;
	position: static;
}
.intro_wrap.intro02 .swiper .swiper-pagination-bullet {
	width: 14px;
	height: 14px;
	background: #cfcece;
	opacity: 1;
	margin: 0 3px;
}
.intro_wrap.intro02 .swiper .swiper-pagination-bullet-active {
	background: #000916;
}
.intro_wrap.intro02 .img_list {
	margin: 30px 0 0;
}
.intro_wrap.intro02 .img_list li {
	text-align: center;
}
.intro_wrap.intro02 .img_list li:nth-child(1) {
	width: 43%;
}
.intro_wrap.intro02 .img_list li:nth-child(2) {
	width: 50%;
}
.intro_wrap.intro02 .movie {
	max-width: 802px;
	width: 100%;
	margin: 105px auto 0;
}
.intro_wrap.intro02 .movie > div {
	padding-top: 56%;
	position: relative;
}
.intro_wrap.intro02 .movie > div > iframe {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
@media screen and (max-width: 1024px) {
.intro_wrap.intro02 {
	margin: 70px 0 0;
}
.intro_wrap.intro02 .flex_wrap .text_wrap {
	width: 100%;
	padding: 0;
}
.intro_wrap.intro02 .flex_wrap .title {
	text-align: center;
}
.intro_wrap.intro02 .flex_wrap .title .is_sp {
	display: block;
}
.intro_wrap.intro02 .swiper .swiper-slide {
	border-radius: 15px;
}
.intro_wrap.intro02 .flex_wrap .text_wrap .slide_wrap {
	max-width: 800px;
	display: block;
	margin: auto;
}
.intro_wrap.intro02 .flex_wrap .text {
	margin: 40px 0 0;
}
.intro_wrap.intro02 .flex_wrap > .slide_wrap {
	display: none;
}
}
@media screen and (max-width: 768px) {
.intro_wrap.intro02 {
	margin: 40px 0 0;
}
.intro_wrap.intro02 .flex_wrap .title {
	font-size: 1.9rem;
	margin: 0 0 16px;
}
.intro_wrap.intro02 .flex_wrap .title .span01 {
	font-size: 2.7rem;
}
.intro_wrap.intro02 .flex_wrap .title .span02 {
	font-size: 2.3rem;
}
.intro_wrap.intro02 .flex_wrap .text {
	font-size: 1.4rem;
	margin: 24px 0 0;
}
.intro_wrap.intro02 .swiper .swiper-slide {
	border-radius: 8px;
}
.intro_wrap.intro02 .swiper .swiper-pagination-bullet {
	width: 10px;
	height: 10px;
}
.intro_wrap.intro02 .img_list li:not(:last-child) {
	margin: 0 0 20px;
}
.intro_wrap.intro02 .img_list li:nth-child(1),
.intro_wrap.intro02 .img_list li:nth-child(2) {
	width: 100%;
}
.intro_wrap.intro02 .movie {
	margin: 40px auto 0;
}
}
@media screen and (max-width: 480px) {
.intro_wrap.intro02 .flex_wrap .title {
	font-size: 4.5vw;
}
.intro_wrap.intro02 .flex_wrap .title .span01 {
	font-size: 7.2vw;
}
.intro_wrap.intro02 .flex_wrap .title .span02 {
	font-size: 6vw;
}
}

/* --------------------------------------------------------
	こんな方々にオススメ！
-------------------------------------------------------- */
#recommend {
	background: #000;
	padding: 0 0 170px;
}
#recommend .list.list01 {
	margin: 0 0 62px;
}
#recommend .list.list01 > li {
	color: #fff;
	width: 49%;
}
#recommend .list.list01 > li > div,
#recommend .list.list01 > li > div > div {
	position: relative;
}
#recommend .list.list01 > li > div {
	height: 100%;
	display: -webkit-box;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	flex-direction: column;
	padding: 32px 24px;
}
#recommend .list.list01 > li > div::before,
#recommend .list.list01 > li > div::after {
	content: "";
	border-radius: 15px;
	display: block;
	position: absolute;
}
#recommend .list.list01 > li > div::before {
	width: 100%;
	height: 100%;
	background: #747474;
	background: linear-gradient(90deg, rgba(116, 116, 116, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(116, 116, 116, 1) 100%);
	top: 0;
	left: 0;
	z-index: 0;
}
#recommend .list.list01 > li > div::after {
	width: calc(100% - 2px);
	height: calc(100% - 2px);
	background: #000;
	top: 1px;
	left: 1px;
	z-index: 1;
}
#recommend .list.list01 > li > div > div {
	z-index: 2;
}
#recommend .list.list02 li {
	width: 32%;
	overflow: hidden;
	margin-right: 2%;
	padding-top: 32%;
	position: relative;
}
#recommend .list.list02 li img {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	object-fit: cover;
}
@media screen and (min-width: 769px) {
#recommend .list.list02 li:nth-child(3n) {
	margin-right: 0;
}
#recommend .list.list02 li:nth-child(n + 4) {
	display: none;
}
}
@media screen and (max-width: 768px) {
#recommend {
	padding: 0 0 56px;
}
#recommend .list.list01 {
	margin: 0 0 28px;
}
#recommend .list.list01 > li {
	width: 100%;
}
#recommend .list.list01 > li:not(:last-child) {
	margin: 0 0 16px;
}
#recommend .list.list01 > li > div {
	padding: 20px 12px;
}
#recommend .list.list01 > li > div::before,
#recommend .list.list01 > li > div::after {
	border-radius: 8px;
}
#recommend .list.list02 li {
	width: 48%;
	margin-top: 4%;
	margin-right: 4%;
	padding-top: 48%;
}
#recommend .list.list02 li:nth-child(-n + 2) {
	margin-top: 0;
}
#recommend .list.list02 li:nth-child(2n) {
	margin-right: 0;
}
}


/* --------------------------------------------------------
	商品の特徴
-------------------------------------------------------- */
#features {
	background: #00112a;
	overflow: hidden;
	padding: 0 0 156px;
	position: relative;
}
#features .bg {
	width: 100%;
	text-align: center;
	position: absolute;
	left: 0;
	z-index: 0;
}
#features .bg img {
	width: 100%;
}
#features .bg.bg01 {
	top: 0;
}
#features .bg.bg02 {
	bottom: 0;
}
#features .inner {
	position: relative;
	z-index: 1;
}
#features .list.is_grad li {
	position: relative;
}
#features .list.is_grad li::before,
#features .list.is_grad li::after {
	content: "";
	border-radius: 15px;
	display: block;
	position: absolute;
}
#features .list.is_grad li::before {
	width: 100%;
	height: 100%;
	background: #747474;
	background: linear-gradient(90deg, rgba(116, 116, 116, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(116, 116, 116, 1) 100%);
	top: 0;
	left: 0;
	z-index: 0;
}
#features .list.is_grad li::after {
	width: calc(100% - 2px);
	height: calc(100% - 2px);
	background: #000;
	top: 1px;
	left: 1px;
	z-index: 1;
}
#features .list.is_grad li > div {
	position: relative;
	z-index: 2;
}
@media screen and (max-width: 768px) {
#features {
	padding: 0 0 56px;
}
#features .list.is_grad li::before,
#features .list.is_grad li::after {
	border-radius: 8px;
}
}

.features_wrap.features01 > .text {
	color: #fff;
	font-size: 1.8rem;
	max-width: 1057px;
	line-height: 1.8;
	margin: auto;
}
.features_wrap.features01 .list {
	margin: 100px 0 0;
}
.features_wrap.features01 .list li {
	color: #fff;
	width: 31%;
	margin-right: 3.5%;
	padding:  min(4.6666vw, 56px) 0 0;
}
.features_wrap.features01 .list li > div {
	height: 100%;
	display: -webkit-box;
	display: flex;
}
.features_wrap.features01 .list .text_wrap {
	padding: 0 min(2vw, 24px);
	position: relative;
	z-index: 1;
}
.features_wrap.features01 .list .dot_title {
	font-size: min(2vw, 2.4rem);
}
.features_wrap.features01 .list .dot_title::after {
}
.features_wrap.features01 .list .text {
	font-size: min(1.3333vw, 1.6rem);
	letter-spacing: 0;
}
.features_wrap.features01 .list .img {
	border-radius: 0 0 15px 15px;
	overflow: hidden;
	margin-top: auto;
	padding: 0 1px 1px;
	position: relative;
	z-index: 0;
}
@media screen and (min-width: 1025px) {
.features_wrap.features01 .list li > div {
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	flex-direction: column;
}
.features_wrap.features01 .list li:nth-child(3n) {
	margin-right: 0;
}
.features_wrap.features01 .list .text_wrap {
	margin-bottom: -20%;
}
}
@media screen and (max-width: 1024px) {
.features_wrap.features01 .list li {
	width: 100%;
	margin-right: 0;
	padding: 1px;
}
	.features_wrap.features01 .list li:not(:last-child) {
		margin: 0 0 20px;
	}
.features_wrap.features01 .list .text_wrap {
	width: 63%;
	min-height: 182px;
	margin-right: -2%;
	padding: min(5.333vw, 40px) 0 min(5.333vw, 40px) min(2.6666vw, 20px);
}
.features_wrap.features01 .list .dot_title {
	font-size: 2.4rem;
}
.features_wrap.features01 .list .text {
	font-size: 1.6rem;
}
.features_wrap.features01 .list .img {
	width: 39%;
	height: 100%;
	border-radius: 0 15px 15px 0;
	padding: 1px 1px 1px 0;
}
.features_wrap.features01 .list .img img {
	max-width: 267px;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	object-fit: cover;
}
}
@media screen and (max-width: 768px) {
.features_wrap.features01 > .text {
	font-size: 1.4rem;
}
.features_wrap.features01 .list {
	margin: 48px 0 0;
}
.features_wrap.features01 .list .dot_title {
	font-size: 1.6rem;
}
.features_wrap.features01 .list .text {
	font-size: 1.2rem;
}
.features_wrap.features01 .list .img {
	border-radius: 0 8px 8px 0;
}
}
@media screen and (max-width: 480px) {
.features_wrap.features01 .list .text_wrap {
	min-height: 44vw;
}
.features_wrap.features01 .list .dot_title {
	font-size: 4.26666vw;
}
.features_wrap.features01 .list .text {
	font-size: 3.2vw;
}
}

/* レイアウト自由 × 規格標準化
-------------------------------------------------------- */
.features_wrap.features02 {
	margin: 120px 0 0;
}
.features_wrap.features02 .list li {
	margin-top: 3.3334%;
	padding: 1px;
}
.features_wrap.features02 .list .img {
	overflow: hidden;
	border-radius: 15px;
}
.features_wrap.features02 .list .text {
	color: #fff;
	font-size: 2.4rem;
	font-weight: 700;
	width: 100%;
	text-align: center;
	padding: min(2.5vw, 30px) 0 0;
	position: absolute;
	top: 0;
	left: 0;
}
@media screen and (min-width: 769px) {
.features_wrap.features02 .list li:nth-child(-n + 2) {
	margin-top: 0;
}
.features_wrap.features02 .list li:nth-child(1) {
	width: 40%;
}
.features_wrap.features02 .list li:nth-child(2) {
	width: 56.6666%;
}
.features_wrap.features02 .list li:nth-child(3),
.features_wrap.features02 .list li:nth-child(4) {
	width: 48.3333%;
}
}
@media screen and (max-width: 768px) {
.features_wrap.features02 {
	margin: 56px 0 0;
}
.features_wrap.features02 .list {
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	flex-direction: column;
	-webkit-box-align: center;
	align-items: center;
}
.features_wrap.features02 .list li {
	width: 100%;
	margin-top: 32px;
}
.features_wrap.features02 .list li:nth-child(1) {
	width: 80%;
	margin-top: 0;
}
.features_wrap.features02 .list .img {
	border-radius: 8px;
}
.features_wrap.features02 .list .text {
	font-size: 1.8rem;
	padding: min(4.5333vw, 17px) 0 0;
}
}

/* 豊富なオプション
-------------------------------------------------------- */
.features_wrap.features03 {
	margin: 112px 0 0;
}
.features_wrap.features03 .list li {
	width: 30%;
	margin-top: 40px;
	margin-right: 5%;
}
.features_wrap.features03 .list .img {
	margin: 0 0 12px;
	position: relative;
}
.features_wrap.features03 .list .img::before,
.features_wrap.features03 .list .img::after {
	content: "";
	border-radius: 15px;
	display: block;
	position: absolute;
}
.features_wrap.features03 .list .img::before {
	width: 100%;
	height: 100%;
	background: #747474;
	background: linear-gradient(90deg, rgba(116, 116, 116, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(116, 116, 116, 1) 100%);
	top: 0;
	left: 0;
	z-index: 0;
}
.features_wrap.features03 .list .img::after {
	width: calc(100% - 2px);
	height: calc(100% - 2px);
	background: #000;
	top: 1px;
	left: 1px;
	z-index: 1;
}
.features_wrap.features03 .list .img > div {
	padding: 1px;
	position: relative;
	z-index: 2;
}
.features_wrap.features03 .list .img > div > div {
	border-radius: 15px;
	overflow: hidden;
	padding-top: 69.4444%;
	position: relative;
}
.features_wrap.features03 .list .img > div > div img {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	object-fit: cover;
}
.features_wrap.features03 .list .text {
	color: #fff;
	font-size: 1.8rem;
	text-align: center;
}
@media screen and (min-width: 769px) {
.features_wrap.features03 .list li:nth-child(-n + 3) {
	margin-top: 0;
}
.features_wrap.features03 .list li:nth-child(3n) {
	margin-right: 0;
}
}
@media screen and (max-width: 768px) {
.features_wrap.features03 {
	margin: 48px 0 0;
}
.features_wrap.features03 .list li {
	width: 48%;
	margin-top: 24px;
	margin-right: 4%;
}
.features_wrap.features03 .list li:nth-child(-n + 2) {
	margin-top: 0;
}
.features_wrap.features03 .list li:nth-child(2n) {
	margin-right: 0;
}
.features_wrap.features03 .list .img {
	margin: 0 0 6px;
}
.features_wrap.features03 .list .img::before,
.features_wrap.features03 .list .img::after,
.features_wrap.features03 .list .img > div > div {
	border-radius: 8px;
}
.features_wrap.features03 .list .text {
	font-size: 1.2rem;
}
}

/* 専用フライトケースで楽々全国発送
-------------------------------------------------------- */
.features_wrap.features04 {
	margin: 150px 0 0;
}
.features_wrap.features04 .border_title span::after {
	width: 238px;
	left: 50%;
	transform: translateX(-50%);
}
.features_wrap.features04 .img {
	width: min(42vw, 426px);
}
.features_wrap.features04 .text {
	color: #fff;
	font-size: 1.8rem;
	width: calc(100% - min(42vw, 426px));
	line-height: 1.8;
	padding: 0 0 0 10%;
}
@media screen and (max-width: 768px) {
.features_wrap.features04 {
	margin: 56px 0 0;
}
.features_wrap.features04 .border_title span::after {
	width: 119px;
}
.features_wrap.features04 .img,
.features_wrap.features04 .text {
	width: 100%;
}
.features_wrap.features04 .img {
	text-align: center;
}
.features_wrap.features04 .img img {
	width: 68%;
}
.features_wrap.features04 .text {
	font-size: 1.4rem;
	margin: 0 0 24px;
	padding: 0;
}
}


/* --------------------------------------------------------
	導入実績
-------------------------------------------------------- */
#works {
	padding: 0 0 120px;
}
#works .en_title .line {
	background: #8A8A8A;
	background: linear-gradient(0deg, rgba(138, 138, 138, 1) 0%, rgba(0, 0, 0, 1) 100%);
}
.scroll_infinity,
.scroll_infinity ul {
	display: -webkit-box;
	display: flex;
}
.scroll_infinity { overflow: hidden; }
.scroll_infinity > ul {
	animation: scroll-right 80s infinite linear 0.5s both;
}
@keyframes scroll-right {
	from {
		transform: translateX(-100%);
	}
	to {
		transform: translateX(0%);
	}
}
.insta_list li {
	min-width: 425px;
	margin-right: 8px;
}
.insta_list li a {
	display: block;
	overflow: hidden;
	padding-top: 100%;
	position: relative;
}
.insta_list li a img {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	object-fit: cover;
}
.insta_list .count_wrapper { display: none; }
#works .btn_wrap {
	margin: 96px 0 0;
}
#works .btn_wrap a {
	color: #fff;
	font-size: 2rem;
	max-width: 300px;
	width: 92%;
	background: #00122e;
	border-radius: 100px;
	display: -webkit-box;
	display: flex;
	-webkit-box-pack: center;
	justify-content: center;
	text-align: center;
	padding: 14px 8px;
	position: relative;
}
#works .btn_wrap a::before {
	content: "";
	width: 26px;
	height: 26px;
	background: url("../img/icon_instagram_wh.svg") no-repeat;
	background-size: contain;
	position: absolute;
	top: calc(50% - 13px);
	left: 50px;
}
@media screen and (max-width: 768px) {
#works {
	padding: 0 0 56px;
}
.scroll_infinity > ul {
	animation: scroll-right 120s infinite linear 0.5s both;
}
.insta_list li {
	min-width: inherit;
	width: calc(100vw / 1.5);
	margin-right: 4px;
}
#works .btn_wrap {
	margin: 32px 0 0;
}
#works .btn_wrap a {
	font-size: 1.6rem;
	max-width: none;
}
#works .btn_wrap a::before {
	width: 20px;
	height: 20px;
	top: calc(50% - 10px);
	left: 24px;
}
}



/* --------------------------------------------------------
	導入までの流れ
-------------------------------------------------------- */
#flow {
	background-image: url("../img/flow_bg.jpg");
	background-position: top center;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 0 0 98px;
}
#flow .en_title {
	text-shadow: 
		rgba(255, 255, 255, .5) 1px 1px 10px, rgba(255, 255, 255, .5) -1px 1px 10px,
		rgba(255, 255, 255, .5) 1px -1px 10px, rgba(255, 255, 255, .5) -1px -1px 10px;
}
.flow_list {
	max-width: 960px;
	margin: auto;
}
.flow_list > li:not(:last-child)::after {
	content: "";
	width: 52px;
	height: 46px;
	background: url("../img/arrow_b_bl.svg") no-repeat;
	background-size: contain;
	display: block;
	margin: 2px auto;
}
.flow_list > li > div {
	border: solid 1px #00122e;
	border-radius: 15px;
	display: -webkit-box;
	display: flex;
	flex-wrap: wrap;
	overflow: hidden;
}
.flow_head {
	color: #fff;
	font-weight: 700;
	width: 293px;
	background: #00122e;
	display: -webkit-box;
	display: flex;
	-webkit-box-align: center;
	align-items: center;
	padding: 20px 10px 20px 40px;
}
.flow_num {
	font-size: 1.4rem;
	margin: 0 0 4px;
}
.flow_num span {
	font-size: 2rem;
}
.flow_title {
	font-size: 2.4rem;
}
.flow_content {
	width: calc(100% - 293px);
	background: #fff;
	padding: 20px 24px;
}
@media screen and (max-width: 768px) {
#flow {
	background-image: url("../img/flow_bg_sp.jpg");
	padding: 0 0 56px;
}
.flow_list > li:not(:last-child)::after {
	width: 41px;
	height: 36px;
}
.flow_head,
.flow_content {
	width: 100%;
	padding: 12px;
}
.flow_head > div {
	width: 100%;
	display: -webkit-box;
	display: flex;
	-webkit-box-align: center;
	align-items: center;
	border-radius: 8px;
}
.flow_num {
	font-size: 1rem;
	margin: 0 8px 0 0;
}
.flow_num span {
	font-size: 1.2rem;
}
.flow_title {
	font-size: 1.5rem;
}
}

/* --------------------------------------------------------
	お問い合わせ
-------------------------------------------------------- */
#contact {
	background: #00122e;
}
.contact_form {
	max-width: 965px;
	width: 100%;
	margin: auto;
}
.contact_form table th {
	color: #fff;
	width: 130px;
	text-align: right;
	padding: 10px 0;
}
.contact_form table td {
	padding: 10px 0 10px 36px;
}
.contact_form .btn_wrap,
.contact_thanks .btn_wrap {
	margin: 46px 0 0;
}
.contact_form button,
.contact_thanks a {
	color: #fff;
	font-size: 1.6rem;
	max-width: 400px;
	width: 100%;
	background: none;
	border: none;
	box-shadow: none;
	display: -webkit-box;
	display: flex;
	-webkit-box-pack: center;
	justify-content: center;
	text-shadow: none;
	padding: 0;
	position: relative;
}
.contact_form button::before,
.contact_thanks a::before {
	content: "";
	width: 21px;
	height: 16px;
	background: url("../img/arrow_r_wh.svg") no-repeat;
	background-size: contain;
	position: absolute;
	top: calc(50% - 8px);
	right: 30px;
	z-index: 2;
}
.contact_form button > span,
.contact_thanks a > span {
	width: 100%;
	display: block;
	padding: 20px 16px;
	position: relative;
}
.contact_form button > span::before,
.contact_form button > span::after,
.contact_thanks a > span::before,
.contact_thanks a > span::after {
	content: "";
	border-radius: 100px;
	display: block;
	position: absolute;
}
.contact_form button > span::before,
.contact_thanks a > span::before {
	width: 100%;
	height: 100%;
	background: #747474;
	background: linear-gradient(90deg, rgba(116, 116, 116, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(116, 116, 116, 1) 100%);
	top: 0;
	left: 0;
	z-index: 0;
}
.contact_form button > span::after,
.contact_thanks a > span::after {
	width: calc(100% - 2px);
	height: calc(100% - 2px);
	background: #00122e;
	top: 1px;
	left: 1px;
	z-index: 1;
}
.contact_form button > span > span,
.contact_thanks a > span > span {
	position: relative;
	z-index: 2;
}
.contact_form button:hover {
	background: none;
	box-shadow: none;
}
@media screen and (max-width: 768px) {
.contact_form table th,
.contact_form table td {
	width: 100%;
	display: block;
}
.contact_form table th {
	text-align: left;
	padding: 0 0 8px;
}
.contact_form table td {
	padding: 0 0 24px;
}
.contact_form table tr:last-child td {
	padding: 0;
}
.contact_form .btn_wrap,
.contact_thanks .btn_wrap {
	margin: 32px 0 0;
}
.contact_form button,
.contact_thanks a {
	font-size: 1.5rem;
}
.contact_form button::before,
.contact_thanks a::before {
	width: 18px;
	height: 14px;
	top: calc(50% - 7px);
	right: 26px;
}
}


/* 送信完了 */
.contact_thanks {
	color: #fff;
	text-align: center;
}
.contact_thanks .title {
	font-size: 3rem;
	font-weight: 700;
	margin: 0 0 24px;
}
@media screen and (max-width: 768px) {
.contact_thanks .title {
	font-size: 1.8rem;
	margin: 0 0 16px;
}
}


/* フォーム */
#mailformpro input[type="text"],
#mailformpro input[type="email"],
#mailformpro input[type="tel"],
#mailformpro select,
#mailformpro textarea {
	font-size: 1.8rem;
	width: 100% !important;
	background: #fff;
	border: solid 1px #b3b3b3;
	border-radius: 10px;
	box-shadow: none;
	padding: 16px 18px;
	box-sizing: border-box;
}
#mailformpro input.mfp_element_all,
#mailformpro textarea.mfp_element_all {
	max-width: 100% !important;
}
#mailformpro textarea {
	height: 200px !important;
}
#mailformpro ::placeholder,
#mailformpro ::placeholder {
	color: #bfbfbf;
}
/* 旧Edge対応 */
#mailformpro ::-ms-input-placeholder,
#mailformpro ::-ms-input-placeholder {
	color: #bfbfbf;
}
/* IE対応 */
#mailformpro :-ms-input-placeholder,
#mailformpro :-ms-input-placeholder {
	color: #bfbfbf;
}

@media screen and (max-width: 768px) {
#mailformpro input[type="text"],
#mailformpro input[type="email"],
#mailformpro input[type="tel"],
#mailformpro select,
#mailformpro textarea {
	font-size: 1.4rem;
	padding: 10px 12px;
}
#mailformpro textarea {
	height: 160px !important;
}
}
