@charset "UTF-8";

/* ページ内の設定 */

/* html {
	font-size: 8.33vw;
} */
html {
	font-size: 1px;
}
/* 共通部分に影響が出ないように */
html > * {
	font-size: 16px;
}

/* コンテンツ固有部分の設定 */
.wrap {
	color:#000;
	width: 100%;
	margin: -6px 0;
	min-width: 1200px;
	font-family: 'Noto Sans JP', sans-serif;
	padding-bottom: 0.3rem;
	font-feature-settings: "palt";
	overflow: hidden;
}
.wrap img {
	vertical-align: bottom;
}
.section {
	overflow: hidden;
}
.inner {
	width: 1200px;
	margin: 0 auto;
}
.font_mincho {
	font-family: 'Noto Serif JP', serif;
}

.bg_blue {
	position: relative;
	background: #e4f5fc;
}
.bg_white {
	padding-top: 1px;
	position: relative;
	background: #fff;
}
.bg_img_1 {
	padding-top: 1px;
	position: relative;
	background:url(../img/pc/product/sozai_ichiba_konoshiro/bg_img_1.jpg) repeat 50% 0 / 1200rem auto;
}
.bg_img_2 {
	padding-top: 1px;
	position: relative;
	background:url(../img/pc/product/sozai_ichiba_konoshiro/bg_img_2.jpg) repeat 50% 0 / 219rem auto;
}
.bg_img_3 {
	padding-top: 1px;
	position: relative;
	background:url(../img/pc/product/sozai_ichiba_konoshiro/bg_img_3.jpg) repeat 50% 0 / 194rem auto;
}
.bg_blue + .bg_white::before {
	content:"";
	width:100%;
	height:200rem;
	background: url(../img/pc/product/sozai_ichiba_konoshiro/bw_bg.jpg) repeat 50% 0 / 983rem auto;
	position: absolute;
	left:0;
	top: -100rem;
}

/* mv */
.mv {
	position: relative;
}
@media(max-width: 1200px){
	.mv {
		--mv-size: 1px;
	}
}
@media(min-width: 1201px){
	.mv {
		--mv-size: calc(100/1200*1vw);
	}
}
@media(min-width: 1440px){
	.mv {
		--mv-size: calc(1440/1200*1px);
	}
}
.mv_head {
	display: flex;
	justify-content: center;
	align-items: center;
	background:#fff;
	height: calc(160 * var(--mv-size));;
}
.mv_head_ttl {
	width: calc(86 * var(--mv-size));
	height: auto;
}
.mv_wave {
	position: absolute;
	z-index: 1;
    bottom: -1px;
	left:0;
	width:100%;
	height: calc(86 * var(--mv-size));
    background: url(../img/pc/product/sozai_ichiba_konoshiro/mv_bg_wave.png) repeat 50% 0% / 655rem auto;
}
.mv_main_back {
	position:relative;
	overflow:hidden;
	max-height: calc(600 * var(--mv-size));
}
.mv_main_back img {
	max-height: 100%;
	object-fit: contain;
	object-position: 50% 50%;
}
.mv_main {
	position: relative;
}
.mv_main_body {
	position: relative;
	padding-bottom: calc(113 * var(--mv-size));
}
.mv_item {
    width: calc(567 * var(--mv-size));
	height:auto;
	position: absolute;
	z-index: 1;
	bottom: 0;
	left:0;
	right:0;
	margin-inline: auto;
	display:block;
}
.mv_txt_area {
	text-align: center;
	font-size: calc(24 * var(--mv-size));
	line-height: calc(42/24);
	letter-spacing: 0.02em;
	margin-top: calc(20 * var(--mv-size));
}
.mv_txt_area_color {
	color: #005DB0;
}
.mv_txt_area_str {
	font-size: calc(65 * var(--mv-size));
	line-height: calc(113.75/65);
}
.mv_bottom_img {
    width: calc(170 * var(--mv-size));
    height: auto;
    margin-inline: auto;
    margin-top: calc(63 * var(--mv-size));
    padding-right: calc(20 * var(--mv-size));
}
.mv_bottom_img img {
	width: 100%;
	height: auto;
}

/* dekirukoto */
.dekirukoto {
    margin-top: 92rem;
    width: 1200rem;
    margin-inline: auto;
    padding-bottom: 175rem;
}
.dekirukoto_ttl {
	text-align: center;
	margin-left: 24rem;
}
.dekirukoto_ttl img {
	width: 1044rem;
	height:auto;
}
.dekirukoto_list {
	display:flex;
	justify-content: center;
	gap: 30rem;
	margin-top: 57rem;
}
.dekirukoto_list > li {
	position: relative;
	overflow: hidden;
	border-radius: 50%;
}
.dekirukoto_list img {
	width: 310rem;
	height:auto;
}

/* mottainai */
.mottainai {
    position: relative;
    padding-bottom: 197rem;
}
.mottainai_ttl {
    position: relative;
    margin-top: -80rem;
    width: 547rem;
    height: auto;
    margin-inline: auto;
    display: block;
}
.mottainai_main_ttl {
    position: relative;
    margin-top: 57rem;
    width: 700rem;
    height: auto;
    margin-inline: auto;
    display: block;
    padding-right: 30rem;
}
.mottainai_txt {
	margin-top: 60rem;
	text-align: center;
	font-size: 22rem;
	line-height:2;
	letter-spacing: 0.02em;
}
.mottainai_body_wrap {
	position: relative;
	margin-top:10rem;
	height: 1276rem;
}
.mottainai_body {
	position: absolute;
	top:0;
	left:50%;
	width: 1260rem;
	margin-left: -630rem;
	height: auto;
}
.mottainai_body_txt {
    position: absolute;
    top: 102rem;
    left: 0;
    width: 100%;
    font-size: 38rem;
    text-align: center;
    letter-spacing: 0.12em;
    color: #00B10E;
}

/* introduce */
.introduce {
	position: relative;
	padding-bottom: 150rem;
}
.introduce_ttl {
    position: relative;
    margin-top: -48rem;
    width: 173rem;
    height: auto;
    margin-inline: auto;
    display: block;
}
.introduce_txt {
    margin-top: 70rem;
    text-align: center;
    font-size: 44rem;
    line-height: 1.1;
}
.introduce_txt_small {
	font-size: 22rem;
    letter-spacing: -0.05em;
    line-height: 1.7;
}
.introduce_main_item_wrap {
	position: relative;
    width: 597rem;
	margin-inline: auto;
	margin-top: 40rem;
}
.introduce_pop {
    position: absolute;
    top: -125rem;
    left: calc(50% - 388rem);
    width: 172rem;
	height:auto;
}
.introduce_main_item {
	position: relative;
	width: 100%;
	height:auto;
}
.introduce_deco_1 {
    position: absolute;
    top: 375rem;
    left: calc(50% - 534rem);
    width: 235rem;
	height: auto;
}
.introduce_deco_2 {
    position: absolute;
    top: 239rem;
    left: calc(50% + 275rem);
    width: 268rem;
}
.introduce_main_body {
    margin-top: 50rem;
    width: 516rem;
    margin-inline: auto;
}
.introduce_main_body_btn {
	display:flex;
	border: 3rem solid #000;
	color:#fff;
	text-decoration: none;
    font-size: 25rem;
    line-height: 1.3;
    text-align: center;
}
.introduce_main_body_btn_inner {
	border: 6rem solid #fff;
	display:flex;
	justify-content: center;
	align-items: center;
	height:100rem;
	width: 100%;
	background:#366BB3;
}
.introduce_main_body_btn_small {
	font-size: 12rem;
}
.introduce_main_body_txt {
    margin-top: 15rem;
    font-size: 16rem;
    margin-inline: 10rem;
    line-height: 1.5;
    letter-spacing: 0.09em;
}
.introduce_main_body_btn_list {
	display: flex;
    justify-content: center;
    align-items: center;
    gap: 23rem;
    margin-top: 23rem;
}
.introduce_main_body_btn_list > li > a {
    width: 150rem;
    height: 45rem;
	display:flex;
	justify-content: center;
	align-items: center;
    font-weight: 700;
    font-size: 18rem;
	text-decoration: none;
}
.btn_detail {
	border:1px solid #000;
	background:#fff;
	color:#000;
}
.btn_amazon {
	background:#000;
	color:#fff;
}
.btn_yodobashi {
	border:1px solid #BDBDBD;
	background:#BDBDBD;
	color:#000;
}

/* catalog */
.catalog {
	position: relative;
    padding-top: 65rem;
    padding-bottom: 88rem;
}
.catalog_ttl_wrap {
	position: relative;
	text-align: center;
	padding-top: 146rem;
}
.catalog_ttl_pop {
	position: absolute;
    top: 0rem;
    left: calc(50% - 431rem);
    width: 207rem;
    height: auto;
}
.catalog_ttl {
	position: relative;
	width: 679rem;
	height:auto;
}
.catalog_list_wrap {
	position: relative;
	width: 834rem;
	margin-inline: auto;
	margin-top: 30rem;
}
.catalog_swiper_prev {
	overflow: hidden;
    position: absolute;
    top: 0;
    bottom: 0;
    width: 43rem;
    height: 175rem;
    display: block;
    margin-block: auto;
    left: -105rem;
    translate: 0 30rem;
}
.catalog_swiper_prev::before {
    content: "";
    width: 120rem;
    height: 120rem;
    border: 7px solid #00b00b;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin-block: auto;
    display: block;
    transform: scaleX(0.4) rotate(45deg);
    transform-origin: 37% 20%;
}
.catalog_swiper_next {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 43rem;
    height: 175rem;
    display: block;
    margin-block: auto;
    right: -105rem;
    translate: 0 30rem;
	overflow: hidden;
	scale: -1;
}
.catalog_swiper_next::before {
    content: "";
    width: 120rem;
    height: 120rem;
    border: 7px solid #00b00b;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin-block: auto;
    display: block;
    transform: scaleX(0.4) rotate(45deg);
    transform-origin: 37% 20%;
}

.catalog-swiper {
	overflow:hidden;
}
.catalog_main {
	width: 834rem;
	height: auto;
}

/* gallery */
.gallery {
	position: relative;
    padding-top: 76rem;
    padding-bottom: 108rem;
}
.gallery_ttl_wrap {
	position: relative;
	text-align: center;
	padding-top: 146rem;
}
.gallery_ttl_pop {
	position: absolute;
    top: 0rem;
    left: calc(50% - 470rem);
    width: 207rem;
    height: auto;
}
.gallery_ttl {
	position: relative;
	width: 757rem;
	height:auto;
}
.gallery_box {
    position: relative;
    margin-top: 42rem;
    padding-right: 22rem;
}
.gallery_f_1 {
    position: absolute;
    top: 34rem;
    left: calc(50% - 280rem);
    width: 169rem;
    height: auto;
}
.gallery_f_2 {
    position: absolute;
    top: 31rem;
    left: calc(50% + 100rem);
    width: 164rem;
    height: auto;
}
.gallery_chara {
	position: relative;
	display: block;
	width: 300rem;
	height:auto;
	margin-inline: auto;
}
.gallery_movie_box {
    margin-top: -48rem;
    position: relative;
    border: 3px solid #00B10E;
    background: #E3E3E3;
    width: 635rem;
    margin-inline: auto;
}
.gallery_movie {
	position:relative;
	overflow:hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 358rem;
}
.gallery_movie_play_icon {
	position: relative;
	z-index:1;
}
.coming_soon .gallery_movie_play_icon {
	display:none;
}
.coming_soon::before {
	content:"COMING SOON";
	font-size: 60rem;
	color:#00b00b;
}
.gallery_movie:not(.coming_soon)::before {
	content:"";
	position: absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:url(../img/pc/product/sozai_ichiba_konoshiro/movie.jpg) no-repeat 50% 50% / cover;
}
.gallery_movie_txt_wrap {
	text-align:center;
	margin-top: 20rem;
}
.gallery_movie_txt {
	width: 475rem;
	height:auto;
}
.img_area {
	position: relative;
}
.img_1 {
	background: url(../img/pc/product/sozai_ichiba_konoshiro/img_area_1.jpg) no-repeat 50% 50% / cover;
	height:300rem;
}
.img_2 {
	background: url(../img/pc/product/sozai_ichiba_konoshiro/img_area_2.jpg) no-repeat 50% 10% / cover;
    height: 280rem;
}

/* story */
.story {
	margin-top: 100rem;
    padding-bottom: 128rem;
	position: relative;
}
.story_ttl {
	width: 761rem;
	height:auto;
	margin-inline: auto;
	display:block;
}
.story_detail {
	display: flex;
	width: 761rem;
	margin-inline: auto;
	gap: 30rem;
	margin-top: 28rem;
}
.story_detail_img_wrap {
	width: 182rem;
}
.story_detail_img {
	width: 100%;
	height: auto;
}
.story_detail_txt_wrap {
    flex: 1;
    font-size: 16rem;
    line-height: 1.75;
    margin-top: -6rem;
}
.story_list {
	margin-top: 57rem;
}
.story_list > li + li {
	margin-top: 22rem;
}
.story_item_set {
	display:flex;
	justify-content: space-between;
	width: 900rem;
    margin-inline: auto;
	gap: 40rem;
}
.story_item_set_center {
	flex: 1;
	font-size: 17rem;
    line-height: 1.63;
}
.story_item_set_left {
	width: 100rem;
}
.story_item_set_right {
    width: 80rem;
    margin-right: 10rem;
}
.right .story_txt_wrap {
	position: relative;
    padding: 20rem 26rem;
	background:#CCEFCF;
    border-radius: 14rem;
    margin-right: 10rem;
}
.right .story_txt_wrap::before {
	content:"";
	position: absolute;
	top: 30rem;
	left: calc(100% - 1px);
	width: 21rem;
	height: 13rem;
	background: url(../img/pc/product/sozai_ichiba_konoshiro/fukidashi.png) no-repeat 0% 0% / contain;
}
.left .story_txt_wrap {
	position: relative;
    padding: 0rem 26rem;
    margin-right: 10rem;
}
.story_item_set_left,
.story_item_set_right {
	position: relative;
}
.story_icon_set {
	position:absolute;
	top:0;
	left:0;
	right:0;
	display:block;
	margin-inline: auto;
}
.story_icon_set_name {
	width: 160%;
	margin-left:-30%;
	text-align:center;
	font-size:12rem;
	letter-spacing: 0.04em;
}
.story_icon_set_img {
	margin-top: 5rem;
}
.icon_ono {
	width: 100rem;
	height: auto;
}
.icon_oyatsu {
	width: 80rem;
	height: auto;
}

/* bottom_area_box */
.bottom_area_wrap {
    margin-block: 20rem;
}
.bottom_area_box {
	width: 470rem;
	margin-inline: auto;
    display: flex;
    align-items: center;
    gap: 50rem;
}
.bottom_area_box_logo,
.bottom_area_logo {
	width: 140rem;
	height: auto;
}
.bottom_area_box_txt {
	flex:1;
	color: #004E8C;
}
.bottom_area_txt {
	width: 105%;
    font-size: 19rem;
    line-height: 1.4;
    margin-top: 5rem;
}
.bottom_area_txt_small {
	margin-top: 15rem;
    font-size: 12.5rem;
}
.bottom_area_txt_small a {
	font-size: 16rem;
	color: inherit;
	text-decoration: none;
}