@charset "UTF-8";

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
li,
dt,
dd,
th,
td,
pre,
caption,
address {
	margin: 0;
}

@font-face {
	font-family: "SoDoSans";
	font-style: normal;
	font-weight: 400;
	src: url("/common/fonts/SoDoSans/SoDoSans-Regular.woff") format("woff2");
}

@font-face {
	font-family: "SoDoSans";
	font-style: normal;
	font-weight: 700;
	src: url("/common/fonts/SoDoSans/SoDoSans-Bold.woff") format("woff2");
}

.mod-en {
	font-family: "SoDoSans";
}

@font-face {
	font-family: "SoDoSans Black";
	font-style: normal;
	font-weight: 400;
	src: url("/common/fonts/SoDoSans/SoDoSans-Black.woff") format("woff");
}

@font-face {
	font-family: "SoDoSans Bold";
	font-style: normal;
	font-weight: 700;
	src: url("/common/fonts/SoDoSans/SoDoSans-Bold.woff") format("woff");
}

@font-face {
	font-family: "SoDoSans SemiBold";
	font-style: normal;
	font-weight: 400;
	src: url("/common/fonts/SoDoSans/SoDoSans-SemiBold.woff") format("woff");
}

article {
	color: #000;
}

article a {
	color: #000;
}

article img {
	width: 100%;
}

article a {
	display: block;
}

article h2,
article h3 {
	margin: 0;
}

p {
	margin: 0;
}

a {
	transition: .3s ease;
}

a:hover {
	opacity: 0.8;
	transition: .3s ease;
}

.mainContentsIn {
	overflow: hidden;
}

.ContentsBox {
	position: relative;
	z-index: 10;
	width: 100%;
	overflow: hidden;
	filter: drop-shadow(2px 4px 5px rgba(0, 0, 0, 0.2));
}

:root {
	--text-color--green: #006241;
	--text-color--head: #661800;
	--text-color--main: #661800;
}


.block-bnr {
	background-color: var(--text-color--green);
	color: #fff;
	width: 100%;
}

.block-bnr img {
	width: 100%;
}

.block-kv {
	background: #de524d url(/youkou/mop_customize_26sum2/images/BG_01.jpg) no-repeat left top / cover;
	color: var(--text-color--main);
	width: 100%;
	height: calc(1490 / 750 * 100vw);
	;
	position: relative;
}

.block-kv .block-kvHead {
	color: var(--text-color--head);
	font-size: calc(46 / 750 * 100vw);
	line-height: 1.5;
	text-align: center;
	position: absolute;
	top: calc(40/ 750 * 100vw);
	left: 0;
	width: 100%;
}

.block-kv .block-kvHead span {
	font-weight: 400;
}

.block-kv .block-kvHead .balloon {
	display: block;
	font-size: calc(24 / 750 * 100vw);
	line-height: 2;
	font-weight: 500;
	margin: 0 auto calc(60 / 750 * 100vw);
	white-space: nowrap;
	width: max-content;
	padding: 0 18px;
	border: solid;
	border-width: 1px 0px;
}

.block-kv .block-kvHead .text {
	position: relative;
    transform: translateY(-13px);
    width: calc(662 / 750 * 100vw);
    left: calc(48 / 750 * 100vw);
}
.block-kv .block-kvHead .text-sub {
	font-family: "Noto Serif JP", serif;
	font-size: calc(30 / 750 * 100vw);
	font-weight: 700;
	line-height: 1.5;
	margin-bottom: calc(20 / 750 * 100vw);
}
.block-kv .block-kvProduct {
	line-height: 1;
    position: absolute;
    top: calc(798 / 750 * 100vw);
    right: 0;
    left: calc(40 / 750 * 100vw);
}

.block-kv .block-kvProduct .title {
	font-size: calc(33 / 750 * 100vw);
	font-weight: 500;
	line-height: 1.6;
}
.block-kv .block-kvProduct .title-sub {
	font-size: calc(26 / 750 * 100vw);
	font-weight: 500;
	line-height: 1.5;
	margin-top: calc(4 / 750 * 100vw);
}
.block-kv .block-kvProduct .title-sub ._02 {
	font-size: calc(24 / 750 * 100vw);
	font-weight: 500;
	line-height: 1.5;
	padding-left: calc(6 / 750 * 100vw);
	font-feature-settings: "palt";
	letter-spacing: 0.1em;
}

.block-kv .block-kvProduct .price {
	font-size: calc(35 / 750 * 100vw);
	font-weight: 500;
	font-weight: 500;
	margin-top: calc(15 / 750 * 100vw);
}

.block-kv .block-kvProduct .txt {
	font-size: calc(18 / 750 * 100vw);
	margin-top: calc(15 / 750 * 100vw);
	font-weight: 500;
	line-height: 1.5;
}

.block-kv .block-kvProduct .txt span {
	font-weight: bold;
	margin-bottom: calc(6 / 750 * 100vw);
	display: inline-block;
}

.block-kv .block-kvNotes {
	position: absolute;
	top: calc(1184 / 750 * 100vw);
}

.block-kv .block-kvNotes li {
	line-height: 1.55;
	font-weight: 500;
}

.notes {
	font-size: calc(15 / 750 * 100vw);
	text-indent: -1rem;
	padding-left: 1rem;
	left: 4.9%;
	width: 89%;
}

.block-kv .block-kvHead02 {
	position: absolute;
	font-family: "Shippori Mincho", serif;
	top: calc(1568 / 750 * 100vw);
	left: 11%;
	line-height: 1.5;
	font-size: calc(46 / 750 * 100vw);
	text-align: center;
	font-feature-settings: "palt";
}

.block-kv .block-kvTxt {
	font-size: calc(24 / 750 * 100vw);
	font-family: "Shippori Mincho", serif;
	font-weight: 400;
	position: absolute;
	top: calc(1815 / 750 * 100vw);
	left: 0;
	width: 100%;
	text-align: center;
	padding: 0 15px;
	line-height: 1.65;
}

.block-kvTxt span {
	font-weight: 500;
}

.fukidashi-txt {
	text-align: center;
    position: relative;
    top: calc(316 / 750 * 100vw);
    left: calc(-92 / 750 * 100vw);
    font-size: calc(24 / 750 * 100vw);
    color: #661800;
    font-feature-settings: "palt";
    letter-spacing: 0.1em;
    line-height: calc(37 / 24);
}

.block-customize {
	background: #d3c8b4 url(/youkou/mop_customize_26sum2/images/BG_02.jpg) no-repeat left top / cover;
	height: calc(1132 / 750 * 100vw);
	position: relative;
	width: 100%;
}

.block-customize .customize-ttl {
	position: relative;
    top: calc(186 / 750 * 100vw);
    left: calc(10 / 750 * 100vw);
    width: calc(429 / 750 * 100vw);
    margin: 0 auto calc(42 / 750 * 100vw);
}

.block-customize .customize-txt {
	position: relative;
    top: calc(191 / 750 * 100vw);
    left: calc(4 / 750 * 100vw);
    font-size: calc(24 / 750 * 100vw);
    line-height: calc(20 / 12);
    text-align: center;
    color: #661800;
    font-feature-settings: "palt";
    letter-spacing: 0.1em;
}


.block-bg {
	background: #de524d url(/youkou/mop_customize_26sum2/images/BG_03.jpg) no-repeat left top / cover;
	height: calc(2992 / 750 * 100vw);
	position: relative;
	width: 100%;
}
.block-info {
	/* background: #de524d url(/youkou/mop_customize_26sum2/images/BG_03.jpg) no-repeat left top / cover;
	height: calc(1313 / 750 * 100vw);
	position: relative;
	width: 100%; */
	position: relative;
}

.block-info .info-ttl {
	position: absolute;
    top: calc(72 / 750 * 100vw);
    left: 0;
    right: 0;
    width: 56%;
    text-align: center;
    margin: auto;
}
.block-info .info-ttl img {
	display: block;
}

.block-info .info-txt {
	position: absolute;
    top: calc(140 / 750 * 100vw);
    left: calc(70 / 750 * 100vw);
    font-size: calc(24 / 750 * 100vw);
    line-height: calc(20.5 / 12);
    font-weight: 500;
    font-feature-settings: "palt";
    letter-spacing: 0.05em;
    color: #661800;
}

.block-info .btn {
	border-radius: 100px;
	display: block;
	font-weight: bold;
	margin: auto;
	padding: calc(40 / 750 * 100vw);
	text-align: center;
}

.block-info .block-infoBtn01 {
	font-size: calc(28 / 750 * 100vw);
	position: absolute;
	top: calc(543 / 750 * 100vw);
	left: 0;
	width: 100%;
}

.block-info .block-infoBtn01 .btn {
	background-color: var(--text-color--green);
	color: #fff;
	width: 81%;
}
.block-info .block-infoBtn01 .btn:hover {
  opacity: 1;
  background-color: #2E7A5C;
}
.block-info .block-infoBtn01._disabled .btn {
  background-image: none;
  background-color: #b3b1ae;
}


.block-info .link {
	color: var(--text-color--green);
	font-size: calc(22 / 750 * 100vw);
	font-weight: bold;
	padding: 5px 0;
	position: relative;
}

.block-info .link:after {
	position: absolute;
	content: "";
	left: 0;
	bottom: 0;
	width: 100%;
	height: 1px;
	background-color: var(--text-color--green);
}

.block-info .block-infoLink01 {
	position: absolute;
	top: calc(832 / 750 * 100vw);
	left: 0;
	width: 100%;
	text-align: center;
}

.block-info .block-infoiconName {
	position: absolute;
	top: calc(1020 / 750 * 100vw);
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	left: 13%;
	gap: calc(32 / 750 * 100vw);
}

.block-info .block-infoiconName .text {
	color: var(--text-color--green);
	font-size: calc(22 / 750 * 100vw);
	text-align: center;
	font-weight: 700;
}

.block-info .block-infoTxt {
	color: var(--text-color--green);
	font-size: calc(22 / 750 * 100vw);
	position: absolute;
	top: calc(1120 / 750 * 100vw);
	width: 83%;
	left: 9.5%;
	font-weight: 500;
}

.block-info .block-infoLink02 {
	position: absolute;
	top: calc(1255 / 750 * 100vw);
	left: 0;
	width: 100%;
	text-align: center;
}

.block-info .block-infoBtn02 {
	font-size: calc(32 / 750 * 100vw);
	position: absolute;
	top: calc(1390 / 750 * 100vw);
	left: 0;
	width: 100%;
}

.block-info .block-infoBtn02 .btn {
	background-image: -moz-linear-gradient( 120deg, rgb(102,24,0) 0%, rgb(157,89,18) 100%);
	background-image: -webkit-linear-gradient( 120deg, rgb(102,24,0) 0%, rgb(157,89,18) 100%);
	background-image: -ms-linear-gradient( 120deg, rgb(102,24,0) 0%, rgb(157,89,18) 100%);
	color: #fff;
	width: 88%;
}
.block-info .block-infoBtn02._disabled .btn {
	background-image: none;
	background-color: #b3b1ae;
}
.block-info .block-infoBtn02._disabled .btn:hover {
	background-color: #b3b1ae;
	opacity: 1;
}
  
.block-info .block-infoNotes {
	color: #661800;
	position: absolute;
	/* top: calc(1430 / 750 * 100vw); */
  top: calc(1558 / 750 * 100vw);
}

.block-info .block-infoNotes li {
	font-weight: 500;
	line-height: 1.55;
}

.block-drive {
	/* background: url(/youkou/mop_customize_26sum2/images/BG_03.jpg) no-repeat left top / cover;
	width: 100%;
	height: calc(1090 / 750 * 100vw); */
	position: relative;
	text-align: center;
}

.block-drive .block-driveHead {
	color: #661800;
    position: absolute;
    top: calc(1928 / 750 * 100vw);
    width: 57%;
    left: 0;
    right: 0;
    margin: auto;
}

.block-drive .block-driveTxt {
	color: #661800;
	font-size: calc(24 / 750 * 100vw);
	font-weight: 400;
	line-height: 1.9;
	position: absolute;
	top: calc(2082 / 750 * 100vw);
	width: 100%;
	left: 0;
}
.block-drive .block-driveImg {
	position: absolute;
    top: calc(2340 / 750 * 100vw);
    left: 0;
    right: 0;
    width: 88%;
    margin: auto;
}

@media print, screen and (min-width: 910px) {
	.mainContentsIn {
		background: url(/youkou/mop_customize_26sum2/images/pc_bg.jpg) no-repeat center top / cover;
		background-attachment: fixed;
		position: relative;
	}

	.ContentsBox {
		max-width: 375px;
		width: 100%;
		margin: 0 auto;
	}

	.block-kv {
		height: 745px;
	}

	.block-kv .block-kvHead {
		font-size: 24px;
		position: absolute;
		top: 20px;
	}

	.block-kv .block-kvHead .balloon {
		font-size: 12px;
		margin-bottom: 28px;
	}

	.block-kv .block-kvHead .text {
		width: 333px;
        margin: 0 auto;
        position: relative;
        left: 2px;
	}
	.block-kv .block-kvHead .text-sub {
		font-family: "Noto Serif JP", serif;
		font-size: 15px;
		margin-bottom: 10px;
	}

	.block-kv .block-kvHead .ruby {
		font-size: 8px;
		top: -4px;
		right: 85px;
	}

	.block-kv .block-kvProduct {
		position: absolute;
		top: 399px;
        left: 20px;
	}

	.block-kv .block-kvProduct .title {
		font-size: 17px;
        line-height: calc(26 / 17);
	}
	.block-kv .block-kvProduct .title-sub {
		font-size: 13px;
        font-weight: 500;
        line-height: 1.5;
        margin-left: -3px;
        margin-top: 2px;
        width: fit-content;
	}
	.block-kv .block-kvProduct .title-sub ._02 {
		font-size: 12px;
		font-weight: 500;
		line-height: 1.5;
		padding-left: 3px;
	}

	.block-kv .block-kvProduct .price {
		font-size: 18px;
		margin-top: 6px;
	}

	.block-kv .block-kvProduct .txt {
		font-size: 9px;
		margin-top: 8px;
	}

	.block-kv .block-kvProduct .txt span {
		font-weight: bold;
		margin-bottom: 3px;
		display: inline-block;
	}

	.block-kv .block-kvNotes {
		top: 594px;
	}

	.notes {
		font-size: 7.5px;
	}

	.block-kv .block-kvHead02 {
		top: 784px;
		font-size: 23px;
	}

	.block-kv .block-kvTxt {
		font-size: 12px;
		top: 908px;
	}

	.block-kvTxt span {
		font-weight: 500;
	}

	.fukidashi-txt {
		font-size: 12px;
    top: 152px;
    left: -45px;
		line-height: calc(19 / 12);
	}
	  
	.block-customize {
		height: 566px;
	}
	.block-customize .customize-ttl {
		position: relative;
		top: 92px;
		left: 5px;
		width: 214.5px;
		margin: 0 auto 21px;
	}
	
	.block-customize .customize-txt {
		position: relative;
		top: 94px;
		left: 2px;
		font-size: 12px;
		line-height: calc(20.5 / 12);
		text-align: center;
		color: #661800;
		font-feature-settings: "palt";
		letter-spacing: 0.1em;
	}
	.block-bg {
		height: 1496px;
	}
	/* .block-info {
		height: 658px;
	} */

	.block-info .info-ttl {
		top: 36px;
        left: -3px;
        width: 212px;
        margin: 0 auto;
        display: block;
	}
	
	.block-info .info-txt {
		top: 69px;
        left: 37px;
        font-size: 12px;
        line-height: calc(20.5 / 12);
	}

	.block-info .block-infoBtn01 {
		font-size: 14px;
		top: 272px;
	}

	.block-info .link {
		font-size: 11px;
	}

	.block-info .block-infoLink01 {
		top: 417px;
	}

	.block-info .block-infoiconName {
		top: 512px;
		gap: 16px;
	}

	.block-info .block-infoiconName .text {
		font-size: 11px;
	}

	.block-info .block-infoTxt {
		font-size: 11px;
		top: 559px;
	}

	.block-info .block-infoLink02 {
		top: 628px;
	}

	.block-info .btn {
		padding: 20px;
	}

	.block-info .block-infoBtn02 {
		font-size: 16px;
		top: 696px;
	}

	.block-info .block-infoNotes {
		top: 779px;
    /* top: 738px; */
	}

	/* .block-drive {
		height: 545px;
	} */

	.block-drive .block-driveHead {
        width: 213px;
        top: 964px;
        left: 1px;
	}

	.block-drive .block-driveTxt {
		font-size: 12px;
		top: 1041px;
	}
	.block-drive .block-driveImg {
        top: 1168px;
        width: 331px;
	}
}
/* 
@media print,
screen and (min-width: 1441px){
	.mainContentsIn {
		background: url(/youkou/mop_customize_26sum2/images/pc_bg_1990.jpg) no-repeat center top / 100vw;
		background-attachment: fixed;
	}
}

@media print,
screen and (min-width: 1920px){
	.mainContentsIn {
		background: url(/youkou/mop_customize_26sum2/images/pc_bg_2560.jpg) no-repeat center top / 100vw;
		background-attachment: fixed;
	}
} */