html {

}


body{
    background:#ede9e1;
    padding:0;
    margin:0;
    color:#5f554f;
    font-size:22px;
    line-height:180%;
    overflow-x:hidden;
    font-family: 'Noto Sans JP', sans-serif;
    letter-spacing: 0.75px;
}


/******  共通  *****/

.width1000 {
    max-width: 1000px;
    width: 100%;
    padding: 0 15px;
    margin: 0 auto;
    box-sizing: border-box;
}

.width1200 {
    max-width: 1200px;
    width: 100%;
    padding: 0 15px;
    margin: 0 auto;
    box-sizing: border-box;
}

.width1300 {
    max-width: 1300px;
    width: 100%;
    padding: 0 15px;
    margin: 0 auto;
    box-sizing: border-box;
}

.width48per {
    width: 48%;
}

img{
    vertical-align:top;
    width:auto;
    max-width:100%;
}

video {
    vertical-align: top;
}

video::-webkit-media-controls {
    background-color: transparent !important;
}
video::-webkit-media-controls-enclosure {
    background-color: transparent !important;
}

video::-webkit-media-controls {
    display: none !important;
}
video::-webkit-media-controls-panel {
    display: none !important;
}
video::-webkit-media-controls-start-playback-button {
    display: none !important;
}

ul{
    padding:0;
    margin:0;
}

li{
    list-style-type:none;
}

.flexArea {
    display: flex;
    flex-wrap: wrap;
}

.space_between {
    Justify-content:space-between;
}

.item-center{
    align-items:center;
}

.item_start{
    Align-items:flex-start;
}

.width55per {
    width: 55%;
}

.width52per {
    width: 52%;
}

.width50per {
    width: 50%;
}

.width45per {
    width: 45%;
}

.flex48per {
    width: 48%;
}

.width43per {
    width: 43%;
}

.width42per {
    width: 42%;
}

.width30per {
    width: 30%;
}

.width40per {
    width: 40%;
}

.s_txt {
    font-size: 18px;
}

.center{
    text-align:center;
}

p{
    Margin-top:0;
}

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

.item-center {
    align-items: center;
}

/******  header  *****/



.pc{display:block;}
.sp{display:none;}

header {
    max-width: 1400px;
    width: 95%;
    margin: 0 auto;
    position: absolute;
    top: 1rem;
    left: 50%;
    transform: translateX(-50%);
}

h1.logo {
    margin: 0;
    max-width: 382px;
    width: 35%;
}

section.firstview img {
    width: 100%;
}

.effect{
    Opacity:0;
}

.effect.active{
    animation: block_anime 1.5s ease 1 forwards;
}

@keyframes block_anime{
	0%{opacity:0; transform:translatey(20px); }
	100%{opacity:1; transform:translatey(0); }
}


@media only screen and (max-width:768px){
.pc{display:none;}
.sp{display: block;}

}

/**** アバウト *****/

.about_img {
    width: 40%;
}

.about_left {
    width: 55%;
}

ul.point_list {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 530px;
    width: 90%;
    margin: 3rem auto 0;
}

ul.point_list li {
    width: 31%;
}

.about_left h3 {
    font-size: 37px;
    font-size: 2rem;
    text-align: center;
    line-height: 180%;
    font-family: serif;
    letter-spacing: 2px;
    margin: 0 0 2rem;
}

.about_txt {
    text-align: center;
    font-size: 1.2rem;
}

.about_txt p:last-of-type {
    margin-bottom: 0;
}

.about_flex {
    align-items: center;
}

.about_outer {
    background-image: url(../image/about_main_pc.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top left;
    padding: 3rem 3rem 5rem;
}

.about_inner {
    text-align: center;
}

about_inner h2 {
    margin: 0;
}

.about_catch {
    margin-bottom: 2rem;
    font-size: 1.5rem;
    letter-spacing: 4px;
}

ul.item_list {
    max-width: 850px;
    margin: -4.5rem auto 7rem;
    width: 95%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

ul.item_list li {
    width: 31%;
}

/**** プロダクト *****/

.product_txt, .product_img {
    width: 49%;
}

.product_txt {
    text-align: center;
}

.product_child_ttl {
    font-family: serif;
    font-size: 40px;
    line-height: 160%;
    font-size: 2.2rem;
    margin: 0 0 2rem;
}

.product_txt p {
    margin: 0;
    font-size: 20px;
    font-size: 1.2rem;
}

.product_child {
    margin: 7rem 0;
    align-items: center;
}

.checklist_area {
    border: 1px solid #5f554f;
    position: relative;
    max-width: 1000px;
    margin: 0 auto;
    width: 100%;
    padding: 3rem 3rem 0;
    box-sizing: border-box;
}

.checklist_flex {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: flex-end;
    max-width: 740px;
    margin: 0 auto;
    width: 100%;
}


ul.checklist {
    width: calc(100% - 155px);
    margin-bottom: 2rem;
}

.checklist_img {
    width: 147px;
}

.checklist_ttl {
    background: #5f554f;
    text-align: center;
    font-family: serif;
    color: #fff;
    font-size: 1.6rem;
    line-height: 150%;
    max-width: 540px;
    width: 95%;
    position: absolute;
    top: -1.2rem;
    left: 50%;
    transform: translateX(-50%);
    padding: 0.5rem;
    letter-spacing: 2px;
}


ul.checklist li p {
    margin: 0;
    font-family: serif;
    font-size: 1.5rem;
    letter-spacing: 2px;
    line-height: 150%;
}

ul.checklist li {
    display: flex;
    margin-bottom: 1rem;
}

ul.checklist li:before {
    content: "";
    width: 1.8rem;
    height: 1.4rem;
    display: block;
    margin-right: 0.5rem;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url(../image/check.png);
    margin-top: 5px;
}

ul.checklist li:last-of-type {
    margin-bottom: 0;
}

.main_product_inner {
    max-width: 1200px;
    width: 90%;
    margin: 0 auto;
    display: flex;
    justify-content: flex-end;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.main_product_txt {
    width: 50%;
    text-align: center;
    max-width: 500px;
}

.main_product_txt h2 {
    font-family: serif;
    line-height: 150%;
    font-size: 2.8rem;
    margin: 0 0 3rem;
    letter-spacing: 4px;
}

.main_product_txt h3 {
    display: inline-block;
    margin: 0 0 1rem;
    overflow: hidden;
    padding-left: 2rem;
    padding-right: 2rem;
}

.main_product_txt h3 p{
    background: #b1a399;
    color: #fff;
    font-weight: normal;
    font-family: serif;
    font-size: 1.7rem;
    padding: 0.5rem 1rem;
    line-height: 130%;
    position: relative;
    z-index: 3;
}

.main_product_txt p {
    font-size: 1.3rem;
    margin: 0;
}

.main_product {
    margin-bottom: 7rem;
    position:relative;
}

.main_product_txt h3 p:before, .main_product_txt h3 p:after{
    content: "";
    width: 3rem;
    height: 100%;
    display: block;
    top: 0;
    position: absolute;
    background: #b1a399;
    z-index: -1;
    transform: skewX(-20deg);
}

.main_product_txt h3 p:before {
    left: -1rem;

}

.main_product_txt h3 p:after {
    right: -1rem;
}

/**** セクション01 *****/

.section01_inner {
    max-width: 1000px;
    margin: 0 auto;
    width: 95%;
}

.speed_movie_child {
    width: 47%;
}

.speed_movie_child video {
    width: 100%;
}

.speed_infoBox {
    position: relative;
    z-index: 3;
}

.speed_movie_child p {
    text-align: center;
    font-family: serif;
    color: #fff;
    font-size: 1.4rem;
    margin-top: 0.5rem;
    margin-bottom: 0;
}

.speed_movie_ttl {
    text-align: center;
    display: block;
    margin: 0 0 1.5rem;
    overflow: hidden;
    padding-left: 2rem;
    padding-right: 2rem;
}

.speed_movie_ttl span{
    display: block;
    position: relative;
    background: #fff;
    color: #b1a399;
    font-size: 1.6rem;
    font-family: serif;
    line-height: 130%;
    padding: 0.5rem 1rem;
    z-index: 3;
}

.speed_movie_ttl span:before, .speed_movie_ttl span:after {
    content: "";
    width: 3rem;
    height: 100%;
    display: block;
    top: 0;
    position: absolute;
    background: #fff;
    z-index: -1;
    transform: skewX(-20deg);
}

.speed_movie_ttl span:before{
    left: -1rem;
}

.speed_movie_ttl span:after{
    right: -1rem;
}

.speed_movieBox {
    max-width: 875px;
    margin: 7rem auto 0;
    width: 95%;
}

section.section01 {
    padding-top: 3rem;
    padding-bottom: 3rem;
}

.section01 .feature_catch span{
    color:#fff;
    border-bottom-color:#fff;
}

.speed_infoBox ul {
    max-width: 875px;
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin: 0 auto;
}

.speed_infoBox ul li {
    width: 30%;
    text-align: center;
    position: relative;
}

.speed_ttl {
    color: #fff;
    font-family: serif;
    margin-bottom: 2rem;
    font-size: 1.6rem;
    position: relative;
}

.speed_date {
    max-width: 700px;
    width: 95%;
    margin: 3rem auto;
    color: #fff;
    font-size: 16px;
    line-height: 160%;
}

.speed_date p{
    position: relative;
    padding-left: 16px;
}

.speed_date p:before {
    content: "※";
    position: absolute;
    top: 0;
    left: 0;
    font-size: 16px;
}

.speed_ttl:before {
    content: "";
    width: 5.5rem;
    height: 5.5rem;
    display: block;
    margin: 0 auto 0.5rem;
    background-repeat: no-repeat;
    background-size: contain;
}

.speed_infoBox ul li:nth-of-type(1) .speed_ttl:before {
    background-image: url(../image/speed01.png);
}

.speed_infoBox ul li:nth-of-type(2) .speed_ttl:before {
    background-image: url(../image/speed02.png);
}

.speed_infoBox ul li:nth-of-type(3) .speed_ttl:before {
    background-image: url(../image/speed03.png);
}

.section01 .feature_catch {
    margin-bottom:3rem;
}

table.section01_table th {
    background: #fff;
    width: 400px;
    font-family: serif;
    color: #b1a399;
    font-size: 36px;
    font-size: 2rem;
    line-height: 160%;
}

table.section01_table {
    border: 1px solid #fff;
    border-collapse: collapse;
    max-width: 940px;
    margin: 5rem auto 7rem;
    width: 90%;
}

table.section01_table td, table.section01_table th {
    padding: 1rem 2rem;
    box-sizing: border-box;
}


table.section01_table td {
    color: #fff;
    font-size: 1.2rem;
    line-height: 180%;
}

section.section01 .width1200 {
    position: relative;
    z-index: 3;
}

.section01 h2 {
    text-align: center;
    font-family: serif;
    font-weight: bold;
    letter-spacing: 3px;
    font-size: 2.6rem;
    margin: 0 0 2rem;
    color:#fff;
}

.speed_img {
    position: relative;
}

.speed_img:after {
    content: "\f0da";
    color: #5f554f;
    font-family: "Font Awesome 5 Free";
    font-weight: bold;
    font-size: 2.5rem;
    position: absolute;
    top: 50%;
    right: -10%;
    transform: translateY(-50%);
}

.speed_infoBox ul li:last-of-type .speed_img:after {
    display:none;
}

/****セクション02*****/

ul.use_list {
    max-width: 1000px;
    width: 90%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

ul.use_list li{
    width: 31%;
}

ul.use_list li h3 {
    background: #5f554f;
    color: #fff;
    font-family: serif;
    font-weight: normal;
    text-align: center;
    margin: 0 0 0.5rem;
    line-height: 140%;
    padding: 0.5rem;
    font-size: 1.5rem;
}

.use_img {
    margin-bottom: 1rem;
}

ul.use_list li p {
    text-align: center;
    font-size: 1.1rem;
    line-height: 170%;
    margin: 0;
}

.use_ttlBox {
    text-align: center;
    margin-bottom: 4rem;
}

.use_ttlBox span {
    font-family: serif;
    display: block;
    font-weight: normal;
    font-size: 30px;
    font-size: 1.9rem;
    margin-top: 1rem;
    letter-spacing: 3px;
}

.section02_img {
    width: 40%;
}

.section02_txt {
    width: 55%;
    text-align: center;
}

p.s_txt {
    font-size: 15px!important;
    margin: 0;
}

ul.section02_list {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    margin: 3rem 0;
}

ul.section02_list li p {
    margin: 0;
    font-size: 1rem;
    font-family: serif;
    line-height: 120%;
    margin-top: 0.8rem;
}

ul.section02_list li {
    text-align: center;
    width: 7rem;
    height: 7rem;
    background: #fffff8;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    margin-right: 0.5rem;
}

ul.section02_list li:last-of-type {
    margin-right: 0;
}

.section02_txt p {
    line-height: 200%;
    font-size:1.2rem;
}

.section02_txt h2 {
    font-family: serif;
    font-size: 2.3rem;
    letter-spacing: 3px;
    margin: 0;
    text-align: center;
}

.useArea {
    margin-top: 10rem;
}

.use_ttlBox h2 {
    margin: 0;
    position: relative;
    display: inline-block;
}

.use_ttlBox h2:before {
    content: "";
    width: 7rem;
    height: 7rem;
    display: block;
    position: absolute;
    top: -4.5rem;
    left: -6.5rem;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url(../image/use_point.png);
}


.section02_txt h2:before {
    content: "";
    width: 150px;
    height: 34px;
    display: block;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url(../image/happy.png);
    margin: 0 auto 1rem;
}

.section02_flex {
    align-items: center;
}

/****カラー*****/

.colorArea h2, .colorArea h3 {
    text-align: center;
}

.colorArea h2 {
    margin: 0 0 2rem;
}

.colorArea h3 {
    font-weight: normal;
    letter-spacing: 4px;
    font-family: serif;
    font-size: 2rem;
    margin: 0 0 4rem;
}

ul.color_imgBox {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    max-width: 960px;
    margin: 0 auto;
    width: 100%;
}

ul.color_imgBox li {
    width: 30%;
}

.color_img {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 2rem;
}

.color_img img:last-of-type {
    width: auto;
    max-width: 85%;
}

ul.color_imgBox li p {
    text-align: center;
    width: auto;
    max-width: 40%;
    margin: 0 auto;
}

section {
    margin-bottom: 8rem;
    margin-top: 8rem;
}

section.firstview {
    margin-top: 0;
}

/****特徴*****/

.feature_child {
    margin-bottom: 4rem;
}

.featureArea .feature_child:last-of-type {
    margin-bottom: 0;
}

.feature_normalBox {
    background: #f5f3ef;
    max-width: 1300px;
    width: 95%;
    padding: 4rem 2rem;
    margin: 0 auto;
    box-sizing: border-box;
}

.feature_child h2 {
    text-align: center;
    font-family: serif;
    font-weight: bold;
    letter-spacing: 3px;
    font-size: 2.6rem;
    margin: 0 0 2rem;
}

.feature_mainimg {
    position: relative;
    width: 100%;
    margin-bottom: 5rem;
}

.feature_mainimg:after {
    content: "";
    width: 14rem;
    height: 12rem;
    display: block;
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    background-repeat: no-repeat;
    background-size: contain;
    max-width: 18%;
}

.feature01 .feature_mainimg:after {
    background-image: url(../image/feature01_point.png);
}

.feature03 .feature_mainimg:after {
    background-image: url(../image/feature03_point.png);
}

.feature04 .feature_mainimg:after {
    background-image: url(../image/feature04_point.png);
}

.feature05 .feature_mainimg:after {
    background-image: url(../image/feature05_point.png);
}

.feature06 .feature_mainimg:after {
    background-image: url(../image/feature06_point.png);
}

.feture_info_txt, .feture_info_img {
    width: 48%;
}

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

.feture_infoArea {
    max-width: 1000px;
    width: 100%;
    margin: 0 auto;
}

.feature_popup_img {
    width: 49%;
    position: relative;
}

.feature_popup_img img{
    width: 100%;
}

.feature01_popup {
    margin: 5rem 0 4rem;
}

.feature_catch {
    font-family: serif;
    font-size: 2.2rem;
    margin: 4rem 0 2rem;
    text-align: center;
}

.feature_catch span {
    display: inline-block;
    border-bottom: 1px solid #5f554f;
    padding-bottom: 5px;
    margin-bottom: 1rem;
    letter-spacing: 2px;
}

.feature01_popup p {
    text-align: center;
    margin: 0;
    font-size: 1.2rem;
    line-height: 200%;
}

.feature_popup_img:after {
    content: "";
    width: 5rem;
    height: 5rem;
    position: absolute;
    top: 0.5rem;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 3;
}

.feature_popup_imgBox .feature_popup_img:nth-of-type(1):after {
    background-image: url(../image/high.png);
    left: 0.5rem;
}

.feature_popup_imgBox .feature_popup_img:nth-of-type(2):after {
    background-image: url(../image/low.png);
    right: 0.5rem; 
}

.feture_info h3 {
    margin: 0 0 2rem;
    font-size: 2.2rem;
    font-family: serif;
    line-height: 160%;
    letter-spacing: 4px;
}

.feture_info_txt h4 {
    margin: 0 0 1rem -1rem;
    text-align: center;
    overflow: hidden;
    padding-left: 2rem;
    padding-right: 2rem;
    display: inline-block;
}

.feture_info_txt h4 p{
    margin: 0;
    background: #b1a399;
    color: #fff;
    font-family: serif;
    font-weight: normal;
    display: inline-block;
    line-height: 120%;
    font-size: 1.6rem;
    letter-spacing: 2px;
    padding: 0.5rem;
    position: relative;
}

.feture_info_txt h4 span{
    z-index: 3;
    position: relative;
}

.feture_info_txt h4 p:before, .feture_info_txt h4 p:after {
    content: "";
    width: 3rem;
    height: 150%;
    display: block;
    top: 0;
    position: absolute;
    background: #b1a399;
    z-index: 1;
    transform: skewX(-20deg);
}

.feture_info_txt h4 p:before {
    left: -0.8rem;
}

.feture_info_txt h4 p:after {
    right: -0.8rem;
}


.feture_info_txt p {
    margin: 0;
    font-size: 1.2rem;
}

.feature01 .feture_info_img {
    background: #fff;
    border: 1px solid #5f554f;
}

.feature_child {
    margin-bottom: 4rem;
}

.featureArea .feature_child:nth-of-type(even) .feture_info{
    flex-direction: row-reverse;
}

.featureArea .feature05 .feature_child .feture_info:nth-of-type(2){
    flex-direction: row!important;
}

.feature02_main {
    max-width: 1100px;
    margin: 0 auto 6rem;
    width: 100%;
}

.feature_child.feature02, .section01{
    background: #b1a399;
    position: relative;
    margin: 15rem 0;
}

.feature_child.feature02 h2{
    color:#fff;
    margin-bottom: 4rem;
}

.feature02_inner{
    max-width: 1300px;
    width: 95%;
    padding: 4rem 2rem;
    margin: 0 auto;
    box-sizing: border-box;
    position: relative;
    z-index: 3;
}

.feature02_main_child {
    width: 50%;
    position: relative;
}

.feature02_main .feature02_main_child:nth-of-type(1) {
    border-right: 3px solid #ede9e1;
    box-sizing: border-box;
}

.feature02_main_child img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.img_ttl {
    width: 100%;
    text-align: center;
    color: #fff;
    font-size: 35px;
    font-size: 2rem;
    position: absolute;
    top: 0.5rem;
    left: 0;
    line-height: 160%;
}

.img_ttl span {
    position: relative;
    display: inline-block;
    margin-right: 12px;
}

.img_ttl span:after {
    content: "※";
    font-size: 14px;
    position: absolute;
    top: -10px;
    right: -14px;
}

.img_txt {
    width: 100%;
    position: absolute;
    bottom: 1rem;
    left: 0;
    text-align: center;
}

.img_txt:after{
    Content:"";
    width: 100%;
    Height: 100%;
    Top: 0;
    left: 0;
    position: absolute;
    background: rgba(177, 163, 153, 0.9);
    mix-blend-mode: multiply;
    z-index: 1;
}

.img_txt p{
    color: #fff;
    font-family: serif;
    font-size: 1.8rem;
    padding: 0.8rem 0.5rem;
    line-height: 150%;
    position: relative;
    margin: 0;
    z-index: 2;
}


.feature02_main .feature02_main_child:nth-of-type(2) .img_txt:after{
    background: rgba(95, 85, 73, 0.9);
}

.feature02 .feture_info_txt {
    position: relative;
}

.feature02 .feture_info_txt:after {
    content: "";
    width: 9rem;
    height: 9rem;
    display: block;
    position: absolute;
    right: -1rem;
    top: -2.5rem;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url(../image/feature02_point.png);
    z-index: 3;
}


.feature02 .feture_info_txt h3 {
    padding-right: 8rem;
    margin-bottom: 1rem;
}

.feature02 .feture_info_txt p {
    max-width: 445px;
    width: 90%;
}

.feature_child.feature02:before, .feature_child.feature02:after, .section01:before, .section01:after{
    content: "";
    width: 100%;
    height: 13rem;
    display: block;
    background: #b1a399;
    position: absolute;
    transform: skewY(5deg);
}

.feature_child.feature02:before, .section01:before {
    top: -6rem;
}

.feature_child.feature02:after, .section01:after {
    bottom: -5rem;
}

.img_ttlBox {
    background: #d4d2cb;
    color: #5f554f;
    font-family: serif;
    font-size: 1.6rem;
    position: relative;
    padding: 0.7rem 4rem;
    text-align: center;
}

.img_ttlBox span {
    background: #5f554f;
    color: #fff;
    position: absolute;
    width: 5rem;
    height: 5rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    letter-spacing: 0;
    top: -1.5rem;
    left: -1.5rem;
    transform: rotate(-16deg);
}

.feature03 .feature_mainimg {
    margin-bottom: 4rem;
}

.feture_info_img img {
    width: 100%;
    height: auto;
}

.feature04_infoBox {
    background: #fffff8;
    max-width: 1100px;
    width: 100%;
    margin: 5rem auto 0;
    padding: 3rem 2rem 4rem;
    box-sizing: border-box;
}

.feature04_infoBox .feature_catch{
    margin-top: 0;
}

.feature04_info_list {
    max-width: 830px;
    width: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.feature04_info_child {
    width: 48%;
}

.feature04_info_ttl {
    background: #b1a399;
    text-align: center;
    color: #fff;
    font-family: serif;
    font-size: 1.5rem;
    line-height: 140%;
    padding: 0.8rem 0.5rem;
}

.feature04_info_img {
    position: relative;
    text-align: center;
    width: 90%;
    margin: 0 auto 1rem;
}


.feature04_info_child ul {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 2rem;
}

.feature04_info_child ul li {
    text-align: center;
    width: 48%;
}

.feature04_info_child ul li span {
    display: block;
}

.feature04_info_child p {
    margin: 0;
    text-align: center;
    line-height: 160%;
    font-size: 1rem;
}

.feature04_info_child ul li span {
    display: block;
    font-size: 18px;
    letter-spacing: 0px;
    display: block;
    min-height: 25px;
    line-height: 100%;
    margin-top: 1rem;
}

.feature04_info_child ul li span img{
    height:16px;
}

.feature04_list_img {
    background: linear-gradient(to top, #f5f5f5 90%, transparent 90%);
    padding-bottom: 8px;
}

.feature04_info_img:after {
    content: "";
    width: 7rem;
    height: 7rem;
    display: block;
    position: absolute;
    top: -1rem;
    left: -1rem;
    display: block;
    background-image: url(../image/feature04_point02.png);
    background-repeat: no-repeat;
    background-size: contain;
}

.feature04_info_list .feature04_info_child:nth-of-type(2) .feature04_info_img:after {
    background-image: url(../image/feature04_point03.png);
}

.feature05 .feture_infoArea {
    margin-bottom: 6rem;
}


.feature05 .feture_infoArea .feture_info:nth-of-type(2) {
    flex-direction: row-reverse;
    margin-top: 4rem;
}

.feature02_main_child .s_txt {
    font-size: 15px;
    color: #fff;
    text-align: center;
    display: block;
}

/****スペック*****/


.specArea h2 {
    text-align: center;
    background: #b1a399;
    color: #fff;
    font-family: serif;
    font-size: 2.5rem;
    letter-spacing: 3px;
    font-weight: normal;
    padding: 1rem 0.5rem;
    margin: 0 0 3.5rem;
}

.spec_imgBox {
    align-items: flex-end;
    max-width: 960px;
    margin: 0 auto 4rem;
    width: 95%;
}

.spec_img {
    width: 50%;
}

.spec_right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.spec_right img:first-of-type {
    width: auto;
    max-width: 30%;
}

.spec_table {
    max-width: 895px;
    width: 90%;
    margin: 0 auto;
    border-collapse: collapse;
}

.spec_table td{
    Width:calc(100% - 185px);
}

.spec_table th {
    width: 185px;
    font-weight: normal;
    text-align: left;
    border-right: 1px solid #fff;
    vertical-align: top;
}

.spec_table th, .spec_table td {
    border-bottom: 1px solid #fff;
    background: #d9d7d0;
    padding: 1rem 1.5rem;
    font-size: 1rem;
    line-height: 180%;
    box-sizing: border-box;
}

.spec_table tr:last-of-type th, .spec_table tr:last-of-type td {
    border-bottom: none;
}


.spec_inner {
    border: 1px solid #b1a399;
    padding-bottom: 4rem;
}

/****動画*****/

.movieBox {
    max-width: 547px;
    margin: 0 auto;
    width: 100%;
}

.movieBox video {
    width: 100%;
    height: 100%;
}


/****お問い合わせ*****/

section.contactArea {
    background: #b1a399;
    padding-top: 3rem;
    padding-bottom: 3rem;
    margin-top: 5rem;
}

.width1000.contactBox {
    background: #fff;
    border-radius: 2rem;
    width:90%;
    Padding:2rem;
}

.contact_txt {
    color: #b1a399;
    text-align: center;
    margin-bottom: 2rem;
}


.contact_txt p {
    border-bottom: 1px solid #b1a399;
    display: inline-block;
    margin: 0;
    font-size: 20px;
    letter-spacing: 1.5px;
    font-family: serif;
}

ul.contact_info {
    display: flex;
    justify-content: space-between;
    max-width: 620px;
    margin: 0 auto;
    width: 100%;
}

ul.contact_info li {
    width: 48%;
    border: 1px solid #b1a399;
    border-radius: 1rem;
    color: #b1a399;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.8rem 0.5rem;
    box-sizing: border-box;
    font-size: 1.3rem;
    flex-direction: column;
    font-family: serif;
    Line-height:160%;
}

ul.contact_info li:first-of-type {
    Background:#b1a399;
    color:#fff;
}

ul.contact_info li span {
    font-size: 14px;
    line-height: 160%;
}

.contact_link {
    max-width: 620px;
    margin: 3rem auto 0;
    width: 100%;
}

.contact_link a:first-of-type{
    Margin-bottom:1.5rem;
}

.contact_link a {
    width: 100%;
    display: block;
    position: relative;
    border-radius: 100px;
    text-align: center;
    color: #b1a399;
    text-decoration: none;
    font-size: 1.1rem;
    letter-spacing: 1px;
    box-shadow: 3px 3px 4px rgba(117, 109, 101, 0.5);
    padding: 1.3rem 3.5rem;
    box-sizing: border-box;
    font-family: serif;
    Transition:0.5s ease;
}

.contact_link a:hover{
    Opacity:1;
    Transform:translate(2px,2px);
    box-shadow: 1px 1px 2px rgba(117, 109, 101, 0.5);
}

.contact_link a:before {
    content: "";
    width: 2.5rem;
    height: 2.5rem;
    background: #b1a399;
    display: block;
    position: absolute;
    top: 50%;
    right: 1rem;
    transform: translateY(-50%);
    border-radius: 50%;
    Transition:0.5s ease;
}

.contact_link a:hover:before {
    background: #87766b;
}

.contact_link a:after {
    content: "\f35d";
    Font-size: 1rem;
    Color: #fff;
    display: block;
    position: absolute;
    top: 50%;
    right: 1rem;
    transform: translate(-50%, -50%);
    font-family: "Font Awesome 5 Free";
    font-weight: bold;
}


@media only screen and (max-width:768px){
section.contactArea {
    padding-top: 40px;
    padding-bottom: 40px;
    width: 95%;
    Margin:30px auto 0;
    border-radius: 20px;
    border: 3px solid #b1a399;
    box-sizing: border-box;
    background: #fff;

}

.contact_txt p {
    font-size: 17px;
    letter-spacing: 1px;
}

.contact_txt {
    margin-bottom: 25px;
}

.width1000.contactBox {
    padding:0 15px;
    width: 100%;
}

ul.contact_info li {
    font-size: 16px;
    width:49%;
    padding: 10px 5px;
}

ul.contact_info li span {
    font-size: 11px;
    letter-spacing: 0px;
}

.contact_link {
    margin: 20px auto 0;
}

.contact_link a {
    font-size: 14px;
    letter-spacing: 0.5px;
    padding: 15px 25px;
}

.contact_link a:before {
    width: 30px;
    height: 30px;
    right: 0.5rem;
}

.contact_link a:after {
    Font-size: 14px;
    right: 0.5rem;
}

.contact_link a:first-of-type {
    Margin-bottom: 15px;
}
}

/****フッター*****/

.main_end img {
    width: 100%;
}

.footer_logo {
    text-align: center;
    margin: 3rem 0;
}

.copyright p {
    text-align: center;
    color: #a8a296;
    font-size: 12px;
}

@media only screen and (max-width:768px){
.endArea .endArea {
    margin-top: 30px;
}

.footer_logo {
    max-width: 260px;
    margin: 20px auto;
}
}

/****動画再生*******/

.movie{
    position: relative;
    width: 45%;
    box-sizing: border-box;
}

.movie video{
    width: 100%;
}

.movie .play-btn{
    display: block;
    width: 20%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    -webkit- transform: translateY(-50%) translateX(-50%);
}

.movie .play-btn.playActive{display:none;}
  

/****レスポンシブ*******/


@media only screen and (max-width:990px){
body {
    font-size: 20px;
}
}

@media only screen and (max-width:930px){
.speed_ttl {
    font-size: 1.4rem;
}

table.section01_table th {
    width: 325px;
}

.feature02 .feture_info_txt h3 {
    font-size: 2rem;
}

.feture_info h3 {
    font-size: 1.8rem;
}

.img_ttlBox {
    font-size: 1.4rem;
}

.main_product_txt h2 {
    font-size: 2.5rem;
}

.main_product_txt h3 p {
    font-size: 1.5rem;
}

.main_product_txt p {
    font-size: 1.2rem;
}

.feture_info_txt h4 p {
    font-size: 1.4rem;
}

.feature_child h2 {
    font-size: 2.3rem;
}

.img_ttl {
    font-size: 1.6rem;
}

.img_txt p {
    font-size: 1.4rem;
}
}


@media only screen and (max-width:850px){
.feture_info_txt h4 {
    margin: 0 0 1rem -2rem;
}

.feture_info_txt h4 p:after {
    right: -1rem;
}

.feture_info_txt h4 p:before {
    left: -1rem;
}

.feture_info_txt h4 p {
    padding: 0.5rem 0;
}

.feature02 .feture_info_txt:after {
    width: 7rem;
    height: 7rem;
    right: -2rem;
}

.feature02 .feture_info_txt h3 {
    padding-right: 4rem;
}

.feature02 .feture_info_txt:after {
    top: -3.5rem;
}

.feature02 .feture_info_txt p {
    width: 100%;
}

.feature05 .feture_info_txt h4 {
        margin: 0px 0 1rem -4rem;
    }
}

@media only screen and (max-width:768px){

body {
    font-size: 15px;
}

section.firstview .sp {
    width: 100%;
}

.sp_column_r{
    display: flex;
    flex-direction: column-reverse;
}


.section01 h2 {
    letter-spacing: 2px;
    font-size: 20px;
    margin: 0 0 25px;
    line-height: 180%;
}

table.section01_table td, table.section01_table th {
    width: 100%;
    display: block;
    padding: 10px 20px;
}

table.section01_table th {
    font-size: 18px;
    padding: 10px 25px;
}

table.section01_table th br{
    display:none;
}

table.section01_table td {
    font-size: 14px;
}

table.section01_table {
    margin: 30px auto 60px;
    width: 90%;
}

.feature_catch {
    font-size: 20px;
    margin: 40px 0 25px;
}

.section01 .feature_catch {
    margin-bottom: 25px;
}

.speed_infoBox ul li:before {
    width: 3.5rem;
    height: 3.5rem;
}

.speed_img:after {
    display:none;
}

.speed_date {
    margin: 30px auto;
    font-size: 13px;
    max-width: 500px;
}

.speed_movieBox {
    margin: 50px auto 0;
}

.speed_movie_child {
    width: 100%;
    max-width: 547px;
    margin: 0 auto 40px;
}

.speed_movieBox .speed_movie_child:last-of-type {
    margin-bottom: 0;
}

.speed_movie_ttl {
    margin-bottom: 20px;
}

.speed_movie_ttl span{
    font-size: 17px;
}

.speed_movie_child p {
    font-size: 18px;
}

.section02_img, .section02_txt, .feture_info_txt, .feture_info_img  {
    width: 100%;
}

.feature_child h2 {
    letter-spacing: 2px;
    font-size: 20px;
    margin: 0 0 25px;
    line-height: 180%;
}

ul.use_list li {
    margin-bottom: 30px;
    width: 100%;
}

ul.use_list li:last-of-type {
    margin-bottom: 0;
}

.feture_info h3 {
    margin: 0 0 25px;
    font-size: 19px;
    letter-spacing: 2px;
    text-align: center;
    width: 100%;
}

.feature_mainimg {
    margin-bottom: 30px;
}

.feature_normalBox {
    padding: 40px 20px;
}

.feture_info_txt {
    text-align: center;
}

.feture_info_txt h4 {
    font-size: 18px;
    letter-spacing: 2px;
    margin: 0px 0 20px;
}

.feture_info_txt p {
    font-size: 15px;
}

.feture_info_img {
    margin-top: 30px;
}

.feature_popup_img {
    width: 100%;
}

.feature_popup_img:after {
    width: 3.5rem;
    height: 3.5rem;
}

.feature01_popup p {
    font-size: 15px;
}

.feature01_popup {
    margin: 60px 0 40px;
}

.feature_child.feature02 h2 {
    margin-bottom: 30px;
}

.feature_child.feature02:before, .feature_child.feature02:after, .section01:before, .section01:after {
    height: 10rem;
}

.feature_child.feature02:before, .section01:before {
    top: -3rem;
}

.feature_child.feature02:after, .section01:after {
    bottom: -3rem;
}

.feature_child.feature02, .section01 {
    margin: 140px 0;
}

.feature02_inner {
    padding: 20px 20px;
}


.img_ttl {
    font-size: 18px;
}

.img_txt p {
    font-size: 17px;
    padding: 0.5rem 0.5rem;
}

.feature02 .feture_info_txt p {
    text-align: left;
}

.feature_mainimg:after {
    width: 6rem;
    height: 6rem;
    top: -15px;
    right: -10px;
    max-width: 30%;
}

.feature02 .feture_info_txt:after {
    width: 6rem;
    height: 6rem;
    top: auto;
    bottom: -6rem;
}

.feature02 .feture_info_txt h3 {
    padding-right: 0;
    margin-bottom: 20px;
    font-size: 20px;
}

.feature02_main {
    margin: 0 auto 60px;
}

.feature02_main_child .s_txt {
    font-size: 12px;
}

.feature03 .feature_mainimg {
    margin-bottom: 30px;
}

.img_ttlBox {
    font-size: 16px;
    padding: 0.7rem 2.5rem 0.7rem;
    text-align: center;
}

.img_ttlBox span {
    width: 3.5rem;
    height: 3.5rem;
    font-size: 15px;
    top: -1rem;
    left: -1rem;
}

.feature03 .feture_info_img {
    margin-top: 50px;
}

.feature_child {
    margin-bottom: 40px;
}

.feature04 .feture_info_txt p span{
    font-size: 13px;
}

.feature04_info_child {
    width: 100%;
    margin-bottom: 50px;
}

.feature04_info_list .feature04_info_child:last-of-type {
    margin-bottom: 0;
}

.feature04_info_ttl {
    font-size: 18px;
    padding: 0.5rem 0.5rem;
}

.feature04_info_img:after {
    width: 5rem;
    height: 5rem;
}

.feature04_infoBox {
    margin: 50px auto 0;
    padding: 40px 20px 40px;
}

.feature04_info_child p {
    font-size: 15px;
}

.feature04_info_child ul {
    margin-bottom: 20px;
}

.feature04_info_child ul li span img {
    height: 13px;
}

.feature04_info_child ul li span {
    font-size: 13px;
}

.feature05 .feture_info:first-of-type {
    margin-bottom: 50px;
}

.feature05 .feture_infoArea {
    margin: 0 auto 40px;
}

.colorArea h2 {
    margin: 0 0 2rem;
    max-width: 410px;
    margin: 0 auto 20px;
    width: 50%;
}

.colorArea h3 {
    letter-spacing: 2px;
    font-size: 18px;
    margin: 0 0 40px;
}

ul.color_imgBox li {
    width: 32%;
}

section {
    margin-bottom: 70px;
    margin-top: 70px;
}

.specArea h2 {
    font-size: 20px;
    letter-spacing: 3px;
    padding: 0.7rem 0.5rem;
    margin: 0 0 30px;
}


.spec_imgBox {
    margin: 0 auto 40px;
}


.spec_table th, .spec_table td {
    display: block;
    width: 100%;
    border: none;
}

.spec_table th {
    border-right: none;
    padding-top: 7px !important;
    padding-bottom: 7px !important;
}

.spec_table th, .spec_table td {
    padding: 10px 15px;
    font-size: 14px;
}

.use_ttlBox span {
    font-size: 20px;
    letter-spacing: 2px;
    line-height: 180%;
}

.use_ttlBox h2:before {
    width: 6rem;
    height: 6rem;
    top: -4rem;
    left: -4rem;
}

.use_ttlBox {
    margin-bottom: 40px;
}

ul.use_list li h3 {
    font-size: 18px;
}

ul.use_list li p {
    font-size: 15px;
}

.section02_txt p {
    font-size: 15px;
}

p.s_txt {
    font-size: 13px !important;
    line-height: 150%;
}

ul.section02_list li p {
    font-size: 14px;
    margin-top: 8px;
}

ul.section02_list {
    margin: 30px 0;
}

ul.section02_list li {
    width: 87px;
    height: 87px;
    margin-right: 10px;
}

.section02_txt h2 {
    font-size: 22px;
    letter-spacing: 2px;
}

.section02_txt h2:before {
    width: 110px;
    height: 25px;
}

.section02_img {
    max-width: 300px;
    margin: 0 auto 40px;
    width: 90%;
}

.about_outer {
    padding: 0;
}

.about_catch {
    margin-bottom: 30px;
    font-size: 16px;
}

.about_inner h2 {
    max-width: 200px;
    margin: 0 auto;
    width: 70%;
}

ul.item_list {
    margin: -40px auto 65px;
}

.about_left {
    width: 100%;
}

.about_img {
    width: 90%;
    max-width: 300px;
    margin: 50px auto 0;
}

.about_left h3 {
    font-size: 20px;
    margin: 0 0 30px;
}

.about_txt {
    font-size: 14px;
}

ul.point_list {
    margin: 40px auto 0;
    max-width: 420px;
}

ul.point_list li {
    width: 32%;
}

.main_product_txt {
    width: 100%;
}

.main_product_txt h2 {
    font-size: 21px;
    margin: 0 0 30px;
}

.main_product_txt h3 p {
    font-size: 16px;
}

.main_product_txt p {
    font-size: 14px;
}

.main_product_inner {
    top: 0;
    transform: none;
    left: auto;
    width: 100%;
    justify-content: center;
}

ul.checklist {
    width: 100%;
    max-width: 308px;
    margin: 20px auto 0;
}

.checklist_img {
    width: 85px;
    margin: 0 auto;
}

.checklist_flex {
    flex-direction: column-reverse;
}

.checklist_ttl {
    font-size: 15px;
    width: 87%;
    letter-spacing: 0.5px;
}

.checklist_area {
    padding: 40px 20px 20px;
    max-width: 500px;
}

ul.checklist li p {
    font-size: 15px;
}

.product_img img {
    width: 100%;
}

ul.checklist li:before {
    width: 17px;
    height: 15px;
    margin-right: 3px;
    margin-top: 3px;
}

ul.checklist li {
    margin-bottom: 10px;
}

.main_product {
    margin-bottom: 70px;
}

.product_txt, .product_img {
    width: 100%;
}

.product_child {
    margin: 50px 0;
    flex-direction: column-reverse;
}

.product_child_ttl {
    font-size: 21px;
    margin: 0 0 30px;
    line-height: 200%;
    font-weight: bold;
}

.product_txt p {
    font-size: 14px;
}

.product_img {
    margin-bottom: 40px;
}

.feature04_infoBox .feature_catch {
    font-size: 19px;
}

.color_img {
    margin-bottom: 15px;
}

.feature_catch span {
    margin-bottom: 10px;
}

.speed_ttl {
    margin-bottom: 0;
    font-size: 16px;
    width: 60%;
    color: #b1a399;
    line-height: 150%;
}

.speed_infoBox ul li {
    width: 100%;
    margin-bottom: 25px;
    display: flex;
    align-items: center;
    border: 1px solid #fff;
    padding: 10px 15px;
    background: #fff;
}

.speed_infoBox ul li:last-of-type {
    margin-bottom: 0;
}

.speed_infoBox ul li:after {
    content: "\f0da";
    color: #5f554f;
    font-family: "Font Awesome 5 Free";
    font-weight: bold;
    font-size: 35px;
    position: absolute;
    bottom: -28px;
    left: 50%;
    transform: translateX(-50%) rotate(90deg);
}

.speed_infoBox ul li:last-of-type:after {
    display:none;
}

.speed_img {
    width: 40%;
}

section.firstview {
    margin-bottom: 70px;
}

.use_ttlBox h2 {
    width: 160px;
}

.useArea {
    margin-top: 120px;
}

.feture_info_txt h4 p span {
    font-size: 17px !important;
    letter-spacing: 1px;
}

.feture_info_txt h4 p {
    padding: 7px 15px;
    line-height: 100%;
}

.speed_ttl:before {
    width: 45px;
    height: 45px;
    margin: 0 auto 4px;
}

.speed_infoBox ul {
    max-width: 355px;
    width: 90%;
}

.speed_infoBox ul li:nth-of-type(1) .speed_ttl:before {
    background-image: url(../image/speed01_brown.png);
}

.speed_infoBox ul li:nth-of-type(2) .speed_ttl:before {
    background-image: url(../image/speed02_brown.png);
}

.speed_infoBox ul li:nth-of-type(3) .speed_ttl:before {
    background-image: url(../image/speed03_brown.png);
}

ul.use_list {
    max-width: 500px;
}

.use_img img {
    width: 100%;
}

.feature05 .feture_info_txt h4 {
    margin: 0px 0 1rem 0rem;
}

.about_outer {
    background-image:none;
}

.feature_popup_imgBox {
    margin-bottom: 30px;
}

ul.section02_list li img {
    width: 60%;
}

.feature01 .feature_catch span {
    letter-spacing: 0.5px;
}

.feature01. .feature_catch {
    font-size: 19px;
}

.feature05 .feture_infoArea .feture_info:nth-of-type(2) {
    margin-top: 3rem;
    border-top: 1px solid #ccc;
    padding-top: 2rem;
}

.feature01 .feture_info_img {
    border: none;
}

.img_ttl span {
    margin-right: 9px;
}

.img_ttl span:after {
    font-size: 10px;
    top: -6px;
    right: -10px;
}

.spec_inner {
    padding-bottom: 20px;
}

.spec_table td {
    background: transparent;
    font-size: 13px;
}

.img_txt {
    bottom: 0.5rem;
}

h1.logo {
    width: 38%;
}

}

@media(max-width:540px){
.feature_mainimg, .section01_mainimg {
    width: 100%;
    height: 230px;
}

.feature_mainimg img, .section01_mainimg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.feature02_main_child {
    width: 90%;
    max-width: 300px;
    margin: 0 auto;
}

.feature02_main .feature02_main_child:nth-of-type(1) {
    border-right: none;
    border-bottom: 3px solid #ede9e1;
}

.main_product_img {
    padding-top: 30px;
}

.feature02 .feture_info_txt p {
    width: 90%;
    margin: 0 auto;
}

.footer_logo {
    max-width: 215px;
}

header {
    top: 10px;
}



}