@charset "UTF-8";
/*------------------------font---------------------- */

@media all and (-ms-high-contrast: none) {
* {
	font-family: YakuHanJP, "Hiragino Kaku Gothic ProN", Noto Sans JP, meiryo, 'Osaka', sans-serif;
}
}
/*------------------------common---------------------- */

html {
font-size: 62.5%;
}

#content {
max-width: 1920px;
color: #231815;
font-size: 16px;
font-family: YakuHanJP, "Hiragino Kaku Gothic ProN", Noto Sans JP, meiryo, 'Osaka', sans-serif;
font-weight: 300;
line-height: 1.4;
letter-spacing: 0.75px;
}

img {
/* width: 100%; */
max-width: 100%;
transition: 1.5s;
vertical-align: top;
}

a {
color: #000;
text-decoration: none;
}

a:hover {
opacity: .8;
}

#content {
max-width: 100%;
}

.pc {
display: none!important;
}

.sp {
display: block!important;
}

@media (min-width: 769px) {
#content {
	max-width: 1920px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-text-size-adjust: 100%;
}
img {
	width: 100%;
}
.pc {
	display: block!important;
}
.sp {
	display: none!important;
}
}
/*------------------------font ---------------------- */
/* font */

.txt_font01 {
font-family: ten-mincho-text, serif;
font-weight: 500;
font-style: normal;
}

.txt_font02 {
font-family: mrs-eaves, serif;
font-weight: 700;
font-style: normal;
}

.word_ver {
writing-mode: vertical-rl;
margin: 0 auto;
}

.ttl {
/* 18 */
font-size: 4.8vw;
/* 24 */
line-height: 3.2vw;
letter-spacing: 0px;
}

.txt_02 {
/* 14 */
font-size: 3.733vw;
/* 24 */
line-height: 6.4vw;
letter-spacing: 1px;
}

.txt_03 {
font-weight: 500;
/* 14 */
font-size: 3.733vw;
/* 28 */
line-height: 7.467vw;
letter-spacing: 1.5px;
}

.txt_04 {
/* 10 */
font-size: 2.66vw;
/* 20 */
line-height: 5.33vw;
letter-spacing: 0.6px;
}

.txt_05 {
/* 12 */
font-size: 3.2vw;
/* 24 */
line-height: 6.4vw;
letter-spacing: 1px;
}

small {
font-size: 7px;
vertical-align: top;
}

@media (min-width: 769px) {
/* font size */
.sub_ttl {
	font-size: 28px;
	line-height: 45px;
	letter-spacing: 2px;
}
.ttl {
	text-align: center;
	font-size: 35px;
	line-height: 35px;
	letter-spacing: 1px;
	font-weight: 300;
}
.txt_02 {
	font-size: 26px;
	line-height: 40px;
	letter-spacing: 1px;
}
.txt_03 {
	font-weight: 300;
	font-size: 28px;
	line-height: 56px;
	letter-spacing: 1px;
}
.txt_04 {
	text-align: justify;
	font-size: 20px;
	line-height: 40px;
	letter-spacing: 1.4px;
	font-weight: 400;
}
.txt_05 {
	font-size: 24px;
	line-height: 48px;
	letter-spacing: 1.5px;
}
small {
	font-size: 14px;
	vertical-align: top;
}
}
/*------------------------floaring banner---------------------- */

.floating_bnr {
width: 99%;
display: block;
left: .5%;
bottom: 10px;
padding: 18px 0;
text-align: center;
font-size: 14px;
letter-spacing: 2.5px;
font-weight: bold;
background-color: #8F8068;
color: #fff;
border-radius: 30px;
position: fixed;
z-index: 20;
transition: .2s;
}

@media (min-width: 769px) {
.floating_bnr {
	width: 98%;
	font-size: 20px;
	font-weight: bold;
	letter-spacing: 3px;
	left: 1%;
	border-radius: 0;
	padding: 20px 0;
	transition: .2s;
}
}
/*------------------------main view---------------------- */

.mv {
background-color: #fff;
}

.mv {
position: relative;
width: 100%;
margin-bottom: 0;
}

.mv .logo {
position: absolute;
left: 31%;
top: 20.5%;
width: 42%;
}

.mv-word {
background-color: #fff;
/* 70 25 */
padding: 20vw 6.667vw;
/* 12 */
font-size: 3.2vw;
/* 24 */
line-height: 6.4vw;
text-align: justify;
letter-spacing: 0.5px;
}

.mv-word img {
width: 50%;
}

.mv-word p {
letter-spacing: 0.75px;
font-weight: 400;
/* 45 */
padding-top: 6vw;
}

@media (min-width: 769px) {
.mv {
	max-width: 1920px;
}
.mv .logo {
	width: 16%;
	position: absolute;
	top: 18%;
	left: 42%;
}
/* customer */
.mv-word {
	text-align: justify;
	padding: 190px 0;
	font-size: 24px;
	line-height: 48px;
	letter-spacing: 0.8px;
}
.mv-word img {
	width: 400px;
	margin: 0 auto 45px;
}
.mv-word p {
	font-weight: 400;
	max-width: 1100px;
	margin: 0 auto;
	padding-top: 0;
}
}
/*------------------------section---------------------- */

.sec {
overflow: hidden;
width: 100%;
margin: 0 auto;
padding: 20vw 0;
position: relative;
}

.sec01 {
background-color: #FFFBF7;
}

.sec02 {
background-color: #F5F9F5;
}

.sec03 {
background-color: #F8F5FA;
}

.sec04 {
background-color: #fff;
}
/* colorful square */

.sec01:before {
content: '';
display: block;
background-color: #E6D9D4;
position: absolute;
left: 24%;
top: 1.5%;
width: 20vw;
height: 20vw;
z-index: 0;
}

.sec02:before {
content: '';
display: block;
background-color: #CCD8D2;
position: absolute;
left: 61%;
top: 1.5%;
width: 13.33vw;
height: 20vw;
z-index: 0;
}

.sec03:before {
content: '';
display: block;
background-color: #E9E1EF;
position: absolute;
left: 11%;
top: 3%;
width: 20vw;
height: 13.33vw;
z-index: 0;
}

.sec04:before {
content: '';
display: block;
background-color: #E6D9D4;
position: absolute;
left: 58%;
top: 1.5%;
width: 20vw;
height: 20vw;
z-index: 0;
}

.wrap {
width: 100%;
max-width: 100%;
margin: 0 auto;
padding: 0 6.667vw;
}

.secTop {
text-align: center;
/* 75 */
padding-bottom: 20vw;
position: relative;
}

.secTop .secTlt {
width: 36%;
margin: 0 auto;
z-index: 99;
}

.secTop .lineTitle {
text-align: justify;
margin: 13.333vw 6.667vw;
letter-spacing: 0.5px;
}

.line span {
margin: 0 auto;
width: 90%;
height: 1px;
display: block;
background-color: #949494;
}

.secTop .line span {
margin: 20vw auto;
}

.sec .block {
max-width: 1100px;
margin: 0 auto 13.3vw;
}

.sec .block:last-child {
margin-bottom: 0;
}

.sec .block_tlt h3 {
line-height: 3.337vw;
margin-bottom: 6.333vw;
margin-left: 6.667vw;
}

.sec .block_tlt .block_c {
display: flex;
justify-content: space-between;
align-items: flex-start;
}

.content {
position: relative;
display: -webkit-flex;
display: -ms-flex;
display: flex;
justify-content: space-between;
align-items: flex-end;
flex-wrap: wrap;
}

.reverse {
flex-direction: row-reverse;
}

.content .word {
width: 100%;
/* margin-bottom: 4vw; */
}

.content p {
text-align: justify;
}

.content .image {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 3.8vw;
}

.content .image>div {
width: 48%;
display: inline-block;
}

.content .image.s01>div {
width: 100%;
}

.content .image span {
/* 12 */
font-size: 3.2vw;
/* 28 */
line-height: 7.467vw;
}

.sec04 .content .image {
flex-wrap: wrap;
}

.sec04 .content .image img:first-child {
padding-bottom: 5px;
}

.content .price {
width: 100%;
text-align: center;
/* 40 */
margin-top: 10.667vw;
}

.content .price .main {
text-align: center;
/* 15px */
padding-bottom: 4vw;
/* 12 */
font-size: 3.2vw;
line-height: 3.2vw;
letter-spacing: 1px;
}

.sec .content .price .main {
font-size: 3vw;
}

.content .price .main .tax {
/* 8 */
vertical-align: top;
font-size: 2vw;
}

.content .price .sub {
text-align: center;
/* 18 */
padding-top: 4.8vw;
/* 10 */
font-size: 2.667vw;
/* 20 */
line-height: 5.33vw;
letter-spacing: 1.5px;
}

.content .price a {
border-bottom: 1px solid #000;
letter-spacing: 2px;
}

.content .price .sub .tax {
vertical-align: top;
font-size: 2vw;
}
/* sec03 */

.sec03 .secTop .secTlt {
width: 46%;
}

.sec03 .content .price {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

.sec03 .content .price>div {
width: 48%;
}

.sec03 .button {
width: 100%;
padding: 4vw 0;
}

.sec03 .content .price .sub {
width: 100%;
}

.sec03 .content .price .main {
padding-top: 2.667vw;
}
/* sec04 */

.sec04 {
padding-bottom: 32vw;
}

.sec04 .secTop p {
text-align: left;
letter-spacing: 1.5px;
}

.sec04 .secTop img {
padding-bottom: 20vw;
}

.sec04 .block_tlt h3 {
text-align: left;
margin-left: 0;
}

.sec.sec04 .block.block4_3 {
margin-top: 30vw;
}

.sec04 .block4_3 .block_tlt h3 {
text-align: center;
letter-spacing: 0;
}

.sec04 .block4_3 .button {
width: 70%;
/* 50 */
margin-top: 13.333vw;
}
/* pc */

@media (min-width: 769px) {
/* colorful square */
.sec01:before {
	background-color: #E6D9D4;
	left: 39.8%;
	top: 4%;
	width: 150px;
	height: 150px;
}
.sec02:before {
	background-color: #CCD8D2;
	left: 54%;
	top: 4.5%;
	width: 85px;
	height: 150px;
}
.sec03:before {
	background-color: #E9E1EF;
	left: 33.5%;
	top: 6.5%;
	width: 145px;
	height: 125px;
}
.sec04:before {
	background-color: #E6D9D4;
	left: 53.5%;
	top: 2%;
	width: 150px;
	height: 150px;
}
.wrap {
	max-width: 1100px;
	padding: 0 0;
}
.sec {
	padding: 0 0 190px 0;
}
.line span {
	width: 1100px;
	max-width: 100%;
	height: 1px;
	display: block;
	background-color: #949494;
}
.secTop .line span {
	margin: 200px auto 0;
}
.secTop {
	padding-bottom: 0;
	padding-top: 0;
	text-align: center;
}
.secContent {
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	max-width: 1100px;
	align-items: center;
}
.secTop .secTlt {
	width: 250px;
	margin: 190px auto 0;
}
.secTop .lineTitle {
	margin: 0 auto;
	order: 3;
	width: 500px;
	letter-spacing: 3px;
}
.secTop .secImage {
	order: 2;
	width: 550px;
}
.secTop .wrap {
	order: 4;
	width: 500px;
}
.secTop .secWord {
	margin-top: 20px;
}
.sec .block {
	margin-bottom: 200px;
}
.sec .block_tlt {
	max-width: 1100px;
	margin: 0 auto 90px;
}
.sec .block_tlt .block_c {
	margin: 0 auto;
	max-width: 1100px;
}
.sec .block_tlt h3 {
	font-size: 24px;
	line-height: 24px;
	margin-top: 190px;
	margin-bottom: 45px;
	margin-left: 0;
	letter-spacing: 1px;
}
.sec .block_tlt .block_c .blockimg {
	width: 700px;
}
.sec .block_tlt .block_c .blockword {
	width: 125px;
	margin-right: 140px;
}
.content {
	align-items: flex-start;
	justify-content: space-between;
	max-width: 1100px;
	margin: 0 auto;
}
.content .number {
	width: 100%;
	margin-bottom: 45px;
	text-align: center;
}
.content .number img {
	width: 60px;
}
.content .word {
	width: 550px;
	margin-bottom: 0;
	text-align: center;
}
.content .word .wrap {
	height: 650px;
	display: flex;
	flex-wrap: wrap;
	align-content: space-between;
}
.content .word h3 {
	position: relative;
	top: -11px;
	text-align: left;
	margin-bottom: 7px;
}
.content .image {
	margin-bottom: 0;
	width: 500px;
}
.content .image span {
	font-size: 24px;
	line-height: 56px;
	letter-spacing: 1px;
}
.content .price {
	margin-top: 0;
}
.sec .content .price .main {
	text-align: center;
	font-size: 24px;
	line-height: 48px;
	letter-spacing: 2.5px;
	padding-bottom: 20px;
}
.sec .content .price .main .tax {
	font-size: 16px;
}
.sec .content .price .sub {
	text-align: center;
	padding-top: 30px;
	font-size: 20px;
	line-height: 40px;
	letter-spacing: 2.5px;
}
.sec .content .price .sub .tax {
	font-size: 16px;
}
.content .image>div {
	width: 100%;
	display: inline-block;
}
/* sec03 */
.sec03 .secTop .secTlt {
	width: 370px;
}
.sec03 .content .word .wrap>div:nth-child(1) p {
	position: relative;
	top: -11px;
}
.sec03 .button {
	width: 250px;
	letter-spacing: 1.5px;
	padding: 30px 0;
}
.sec03 .content .price .main {
	font-size: 18px;
	line-height: 18px;
}
/* sec04 */
.sec04 .secTop {
	width: 650px;
	margin: 0 auto;
	letter-spacing: 3.5px;
}
.sec04 .secTop img {
	padding-bottom: 90px;
}
.sec04 .secTop p {
	letter-spacing: 3.5px;
	text-align: center;
}
.sec04 .content {
	justify-content: center;
}
.sec04.sec .block_tlt {
	margin-bottom: 45px;
}
.sec04.sec .block_tlt h3 {
	margin: 90px auto 0;
	text-align: center;
	letter-spacing: 1px;
}
.sec04 .content .word {
	width: 650px;
}
.sec04 .content p {
	margin-top: 45px;
	letter-spacing: 1.3px;
}
.sec04 .content .image {
	width: 650px;
}
.sec.sec04 .block.block4_3 {
	margin-top: 190px;
}
.sec.sec04 .block.block4_3 img {
	max-width: 750px;
}
.sec04 .block4_3 .button {
	font-size: 24px;
	width: 500px;
	margin-top: 100px;
	font-weight: 200;
	padding: 35px 0;
}
}
/*------------------------slider ------------ */

.p_slider {
max-width: 100%;
}

.p_slider .buy {
margin-top: 10px;
}

.p_slider .buy>span {
letter-spacing: 1.5px;
}

.p_slider .buy>span .tax {
font-size: 9px;
letter-spacing: 1px;
}

.p_slider .buy .more {
margin-left: 10px;
letter-spacing: 1px;
font-weight: bold;
border-bottom: 1px solid #000;
font-size: 3.2vw;
}

@media (min-width: 769px) {
.p_slider {
	max-width: 650px;
	margin: 0 auto;
}
.p_slider .buy {
	margin-top: 20px;
	text-align: center;
}
.p_slider .buy .more {
	font-size: 20px;
}
.p_slider .buy>span {
	font-size: 20px;
}
.p_slider .buy>span .tax {
	font-size: 14px;
}
}
/*------------------------button ---------------------- */
/* pc */

@media (min-width: 769px) {}

.button {
width: 95%;
display: block;
margin: 0 auto 0;
cursor: pointer;
text-align: center;
font-size: 2.667vw;
background-color: #000;
color: #fff;
text-decoration: none;
padding: 5.33vw 0;
letter-spacing: 1.5px;
transition: .3s;
font-weight: bold;
}

.button:hover {
transition: .3s;
letter-spacing: 4px;
}
/* pc */

@media (min-width: 769px) {
.button {
	width: 500px;
	letter-spacing: 3px;
	font-size: 20px;
	padding: 40px 0;
}
}
/*------------------------staff ---------------------- */
/*------------------------feature ---------------------- */

.feature {
text-align: center;
}

.feature .wrap {
padding: 20vw 5.333vw;
}

.feature.recommend .wrap {
padding: 20vw 0 5.333vw;
}

.feature .feature_title {
font-weight: bold;
font-size: 3.5vw;
line-height: 15px;
letter-spacing: 1.5px;
margin-bottom: 20px;
}

.feature.staff .feature_title {
letter-spacing: 2px;
}

.feature ul.two {
text-align: justify;
padding: 0 20px;
justify-content: space-between;
}

.feature ul.two {
width: 100%;
padding: 0 20px;
justify-content: space-between;
margin: 0 auto;
display: flex;
flex-wrap: wrap;
}

.feature ul.two li {
width: 46%;
border: 0;
margin: 0 0 30px 0;
}

.feature li {
border: none;
}

.feature ul.two li .f_tlt {
color: #000;
font-size: 3vw;
line-height: 6vw;
letter-spacing: 1px;
padding: 8px 0 0px;
font-weight: 500;
}

.feature ul.two li p {
font-size: 3vw;
line-height: 4vw;
font-weight: 200;
letter-spacing: 1px;
color: #808080;
}

.feature .two img {
transition: .2s;
}

.feature .two img:hover {
transition: .2s;
opacity: .9;
}

.secLine.grayLine {
max-width: 100%;
}

.secLine .line {
width: 100%;
background-color: #d4d4d4;
height: 1px;
}

.feature .button {
width: 66.7vw;
display: block;
margin: 6.667vw auto 0;
cursor: pointer;
text-align: center;
font-size: 2.667vw;
color: #000;
background-color: transparent;
text-decoration: none;
letter-spacing: 1.5px;
transition: .3s;
font-weight: bold;
border: 1px solid #000;
padding: 15px 0;
}

@media screen and (min-width: 768px) and (max-width: 1101px) {
.button {
	margin-top: 50px;
}
.feature ul.two {
	padding: 0;
}
.feature ul.two li {
	width: 300px;
}
}

@media only screen and (min-width: 768px) {
.feature .wrap {
	padding: 120px 0;
	max-width: 1100px;
	width: 100%;
	margin: 0 auto;
}
.feature.recommend .wrap {
	padding: 100px 0 70px;
}
.feature .feature_title {
	font-size: 28px;
	line-height: 45px;
	letter-spacing: 2px;
	text-align: center;
	font-weight: 600;
	margin-bottom: 60px;
}
.feature.staff .feature_title {
	font-family: Noto Sans JP, sans-serif;
	font-weight: bold;
	letter-spacing: 2.8px;
}
.feature.staff img {
	width: 60%;
}
.feature ul {
	padding: 20px 0 0;
}
.feature ul.two {
	padding: 0;
	justify-content: space-between;
	max-width: 660px;
}
.feature ul.two li {
	width: 305px;
	margin-bottom: 50px;
	text-align: left;
}
.feature ul.two li .f_tlt {
	padding: 15px 0 8px;
	font-weight: bold;
	color: #000;
	font-size: 18px;
	line-height: 21px;
	letter-spacing: 1.5px;
	white-space: nowrap;
	text-align: justify;
}
.feature ul.two li p {
	font-weight: 100;
	color: #808080;
	font-size: 17px;
	line-height: 29px;
	letter-spacing: 1.5px;
	text-align: justify;
}
.feature .button {
	text-align: center;
	margin: 150px auto 0;
	width: 480px;
	font-size: 23px;
	font-weight: 400;
	background-color: transparent;
	border: 2px solid #3C3C3C;
	color: #000;
	margin-top: 40px;
	padding: 26px 0;
}
.secLine.grayLine {
	max-width: 1100px;
	margin: 0 auto;
}
}