﻿@import url('https://fonts.googleapis.com/css2?family=Kosugi+Maru&display=swap');

body,h2, h3, h4{
    font-family: "Kosugi Maru", sans-serif !important;
}

/*----- TOP FV -----*/

#main_img{
    background-color:#ddc0a5;
}
.swiper-container{
    opacity: 0.8;
}

.fv_item01{
    position: absolute;
    z-index: 999;
    width: 25%;
    bottom: 1%;
    right: 1%;
}
.fv_item02{
    position: absolute;
    z-index: 999;
    width: 11%;
    top: 14%;
    left: 6%;
}
.fv_item03{
    position: absolute;
    z-index: 998;
    width: 30%;
    bottom: -7%;
    left: 0%;
}
.fv_item_wrap{
/*     position: absolute;
z-index: 999;
bottom: 0%;
right: 0%; */
}

@media(max-width: 780px){
.triangle01 {
    border-width: 0 0 22vw 42vh;
}
#main_img {
        height: 70vw;
}
    .fv_item01{
    width: 47%;
        bottom: -16%;
        right: 1%;
}
.fv_item02{
        width: 15%;
        top: 15%;
        left: 3%;
}
.fv_item03{
    width: 47%;
    bottom: -7%;
    left: -13%;
}
}
@media(max-width: 667px){
.triangle01{
    border-width:0 0 22vw 30vh;
}
    #main_img {
height: 76vw;
    }
    .fv_item01{
        width: 50%;
        bottom: -9%;
        right: 1%;
}
.fv_item02{
width: 19%;
        top: 10%;
        left: 78%;
}
.fv_item03{
    width: 43%;
    bottom: -7%;
    left: -13%;
}
}

/*----- TOP コンテンツ -----*/
@media screen and (max-width: 768px) {
    #top_contents1 .con1_img2 div {
        min-width: initial!important;
    }
}

/*----- TOP goods -----*/
/* ---------- loopSlider ---------- */
#topcms_gallery_type1 .loopSliderWrap{
    top: 0;
    left: 0;
    height: 320px;
}
#topcms_gallery_type1 .loopSlider {
    margin: 0 auto;
    height: 320px;
    text-align: left;
    position: relative;
    overflow: hidden;
}
#topcms_gallery_type1 .loopSlider .ul {
    height:320px;
    float: left;
    overflow: hidden;
}
#topcms_gallery_type1 .loopSlider .ul .li {
    width: 320px;
    height: 320px;
    float: left;
    display: inline;
    overflow: hidden;
	position: relative;
	box-sizing: border-box;
	padding: 0;
}
#topcms_gallery_type1 .loopSlider .ul .li img{
    border-radius: 0;
}
#topcms_gallery_type1 .loopSliderWrap:after {
    content: "";
    display: none;
    clear: none;
}

/*リンクボタン*/
#topcms_gallery_type1 .btn{z-index: 3;}
#topcms_gallery_type1 .btn a::before {
    content: '';
    position: absolute;
    bottom: 55px;
    right: 27%;
    width: 42%;
    height: 1px;
    background: #333;
    transition: all .3s;
}
#topcms_gallery_type1 .btn a::after {
    content: '';
    position: absolute;
    bottom: 60px;
    right: 27%;
    width: 15px;
    height: 1px;
    background: #333;
    transform: rotate(35deg);
    transition: all .3s;
}
#topcms_gallery_type1 .btn a:hover::before {
    right: 16%;
    background: #fff;
}
#topcms_gallery_type1 .btn a:hover::after {
    right: 15%;
    background: #fff;
}
#topcms_gallery_type1 .btn {
    display: block;
}
#topcms_gallery_type1 .btn a {
    background: #fff;
    color: #212121;
    width: 200px;
    height: 200px;
    display: flex;
    align-content: center;
    justify-content: center;
    border-radius: 50%;
    flex-wrap: wrap;
    transition: all 0.4s;
}
#topcms_gallery_type1 .btn a:hover {
    background: #1c1c1c;
    color: #fff;
}
#topcms_gallery_type1 .btn a span, .btn a strong {
    text-align: center;
}
@media(max-width: 768px) {
#topcms_gallery_type1,#topcms_gallery_type1 .loopSliderWrap,#topcms_gallery_type1 .loopSlider,#topcms_gallery_type1 .loopSlider ul,#topcms_gallery_type1 .loopSlider .ul .li{
	height: 280px;
}
#topcms_gallery_type1 .loopSlider .ul .li{
    width: 280px;
}
#topcms_gallery_type1 {
    padding-bottom: 0;
    padding-top: 0;
}
}
@media(max-width: 667px) {
#topcms_gallery_type1,.loopSliderWrap,.loopSlider,.loopSlider .ul,.loopSlider .ul .li{
	height: 179px!important;
}
#topcms_gallery_type1 .loopSlider .ul .li{
    width: 179px;
}
#topcms_gallery_type1 .btn a::after {
    bottom: 35px;
    right: 27%;
}
#topcms_gallery_type1 .btn a::before {
    bottom: 30px;
    right: 27%;
}
#topcms_gallery_type1 .btn a {
    width: 150px;
    height: 150px;
    line-height: 1.7;
}
}

/*----- よくある質問 -----*/
#cms_5-d .box_title1:before{
    border-color:#f6ede5 transparent!important;
}

/*----- サイトマップ -----*/
#page10 .txt_color1:hover{
    color: var(--color4)!important;
}
#page10 .border_color2{
    border-color: var(--color4)!important;
}

/*----- 全体共通 -----*/
.cate_list li{
    border-radius:50px;
    background-color:var(--color1);
}
.cate_list li a{
    color:#fff!important;
}

/*----- 全体共通　メニュー -----*/
.con_navbar .width_1280-max{
    max-width: 1380px;
}

/*----- 全体共通 ハンバーガーメニュー -----*/
#sp_nav li a{
    color:var(--black)!important;
}
#sp_nav li a:hover{
    color:var(--color4)!important;
}

/*----- 足跡 ----*/
.svg_box{
    position: absolute;
    top: 50%;
    left: 14%;
}

.svg_box2{
    position: absolute;
    top: 87%;
    left: 74%;
}

.svg_box .dec,.svg_box2 .dec{opacity: 0}
.dec {
    width: 35px;
}
#dec1,#dec3,#dec5,#dec7{
	margin-left: 151.5%;
	margin-top: 29px;
	margin-bottom: 5px;
}
#dec2,#dec4,#dec6,#dec8{
	margin-left: 38%;
	margin-top: 26px;
	margin-bottom: 5px;
}
svg {
	fill: currentColor;
}
footer .svg_box{
	    position: absolute;
	width: 50%;
	max-width: 200px;
	    transform: rotate(-40deg);
    -moz-transform: rotate(-40deg);
    -webkit-transform: rotate(-40deg);
}
footer svg{
	opacity: 0.1;
}
footer .dec {
    width: 80px;
	    transform: rotate(40deg);
    -moz-transform: rotate(40deg);
    -webkit-transform: rotate(40deg);
}
#dec9,#dec11,#dec13,#dec15{
	margin-left: auto;
	margin-top: 5px;
	margin-bottom: 5px;
}
#dec10,#dec12,#dec14,#dec16{
	left: 100%;
	margin-top: 5px;
	margin-bottom: 5px;
}
#contents .box figure{
	width: 45%;
    position: relative;
	z-index: 1;
}
#contents .box figure:after{
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 95%;
    height: 0%;
    z-index: -1;
    border: 155px solid;
    opacity: 0.15;
}
#contents .box:nth-child(odd) figure:after{
	   right: 40%;
	    -moz-transform: translateX(50%);
    -webkit-transform: translateX(50%);
    -ms-transform: translateX(50%);
    transform: translate(50);
}
#contents .box:nth-child(even) figure:after{
    left: 40%;
	    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translate(-50);
}
#contents .box .txt_wrap{
		width: 45%;
}
#contents .box h3{
	display: inline-block;
	position: relative;
}
#contents .box h3:before {
    content: '';
    position: absolute;
    bottom: -10px;
    display: inline-block;
    width: 35px;
    border-bottom: 2px solid;
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
    .svg_box {
        top: 83%;
        z-index: 2;
        left: 20%;
    }
.svg_box2 {
    top: 97%;
    left: 76%;
}
    #dec1, #dec3, #dec5, #dec7 {
    margin-left: 47%;
}
#dec2, #dec4, #dec6, #dec8 {
    margin-left: 171%;
}
}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
    .svg_box {
        top: 89%;
    }
    .dec {
    width: 30px;
}
#dec2, #dec6 {
    margin-left: 57%;
}
#dec1, #dec5 {
    margin-left: -66%;
}
#dec3,#dec4,#dec7,#dec8{
    display: none;
}
}