@charset "utf-8";

:root {
	--width-pc: 980px;
	--width-sp: 375px;

	--main-theme-color:    #006036;
	/*--sub-theme-color:     #d0a900;*/
	--sub-theme-color:     #b4952c;
	--sub-theme-color-2:     #d2c69e;
	--sub-theme-color-txt: #000;
	--main-theme-color-bg: #fff;
}

ul.breadcrumbs {
	display: flex;
	padding: 10px 2%;
	margin: 0;
}
ul.breadcrumbs > li {
	display: block;
	font-size: var(--compact-font-size);
}
ul.breadcrumbs > li + li {
	margin-left: 3px;
}
ul.breadcrumbs > li + li::before {
	content: "＞";
	margin-right: 3px;
}
a:hover,
a:link,
a:visited {
	color: #000000;
}

main section .button-others {
	width: 180px;
	margin: 0 auto 10px;
}
main section .button-others a {
	position: relative;
	display: block;
	padding: 5px;
	background: #333333;
	border: 1px solid #333333;
	color: #ffffff;
	text-align: center;
}
main section .button-others a:hover {
	background: #ffffff;
	color: #333333;
	text-decoration: none;
}
main section .button-others a i.fas {
	position: absolute;
	top: calc(50% - 8px);
	right: 3%;
}


h2,h3{
    padding: 0 ;
    margin: 0;
    text-align: center;
}

main .button-primary,
main .button-secondary {
    width: 240px;
    margin: 6% auto;
}
main .button-primary a {
    position: relative;
    display: block;
    padding: 10px;
    background: var(--sub-theme-color-txt);
    border: 1px solid #000;
    color: #fff;
    text-align: center;
    font-size: 1rem;
    font-weight: bold;
}
main .button-primary a:hover {
    background:#fff;
    color: var(--sub-theme-color-txt);
    text-decoration: none;
}
html {
    scroll-behavior: smooth;
    /*background-color: #f5f5ee;
    background-color: #e5e4d2;*/
    font-family: "ryo-gothic-plusn", "Ryo Gothic PlusN", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    }
li {
    list-style:none
    }
/*------------------------------------*/

main section.key-visual {
	/*background-image: url(../images/kv-bg.png);
	background-repeat: repeat;*/
	position: relative;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #0f6036;
    /*background-color: #fffffe;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 60 60'%3E%3Cg fill-rule='evenodd'%3E%3Cg fill='%23cde2d9' fill-opacity='0.4' fill-rule='nonzero'%3E%3Cpath d='M29 58.58l7.38-7.39A30.95 30.95 0 0 1 29 37.84a30.95 30.95 0 0 1-7.38 13.36l7.37 7.38zm1.4 1.41l.01.01h-2.84l-7.37-7.38A30.95 30.95 0 0 1 6.84 60H0v-1.02a28.9 28.9 0 0 0 18.79-7.78L0 32.41v-4.84L18.78 8.79A28.9 28.9 0 0 0 0 1.02V0h6.84a30.95 30.95 0 0 1 13.35 7.38L27.57 0h2.84l7.39 7.38A30.95 30.95 0 0 1 51.16 0H60v27.58-.01V60h-8.84a30.95 30.95 0 0 1-13.37-7.4L30.4 60zM29 1.41l-7.4 7.38A30.95 30.95 0 0 1 29 22.16 30.95 30.95 0 0 1 36.38 8.8L29 1.4zM58 1A28.9 28.9 0 0 0 39.2 8.8L58 27.58V1.02zm-20.2 9.2A28.9 28.9 0 0 0 30.02 29h26.56L37.8 10.21zM30.02 31a28.9 28.9 0 0 0 7.77 18.79l18.79-18.79H30.02zm9.18 20.2A28.9 28.9 0 0 0 58 59V32.4L39.2 51.19zm-19-1.4a28.9 28.9 0 0 0 7.78-18.8H1.41l18.8 18.8zm7.78-20.8A28.9 28.9 0 0 0 20.2 10.2L1.41 29h26.57z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
*/}
.key-visual img{
    width: 100%;
    height: auto;
}
/*２列*/
/*.h1-style {
    position: absolute;
    top: 50%;
    left: 42%;
    transform: translate(-40%, -60%);
    background-color: #fff;
    white-space: normal;
    padding: 0 2%;
    text-align: center;
    color: #006036;
}*/
/*1列*/
.h1-style {
	position: absolute;
    /* top: 42%; */
    /* left: 37%; */
    transform: translate(0%, -30%);
    background-color: #0f6036;
    white-space: normal;
    padding: 1% 1% 2.4%;
    text-align: center;
    width: 100%;
    color: #fff;
}


.jump{
    background-color: var(--main-theme-color);
}
#jump-service,#jump-features,#jump-faq,#jump-stores {
    height: 100px;
}
main section.strengths {	
	background-color: #a29254;
    background-image: url("data:image/svg+xml,%3Csvg width='12' height='16' viewBox='0 0 12 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 .99C4 .445 4.444 0 5 0c.552 0 1 .45 1 .99v4.02C6 5.555 5.556 6 5 6c-.552 0-1-.45-1-.99V.99zm6 8c0-.546.444-.99 1-.99.552 0 1 .45 1 .99v4.02c0 .546-.444.99-1 .99-.552 0-1-.45-1-.99V8.99z' fill='%23ffffff' fill-opacity='0.21' fill-rule='evenodd'/%3E%3C/svg%3E");
    padding: 2% 0 15%;
}
main section.strengths h2 {
}

.h2-deco {
    text-align: center;
    position: relative; /* 擬似要素の配置の基準とする */
}

.h2-deco h2 {
    border-top: 1px solid var(--main-theme-color);
    border-bottom: 1px solid var(--main-theme-color);
    display: inline-block;
    position: relative; /* 擬似要素の配置の基準とする */
    z-index: 1; /* 要素を前面に表示 */
    padding: 3% 6%;
   background-color: #fff;
   margin: 8% auto;
}

.h2-deco h2::before, .h2-deco h2::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--main-theme-color); /* 外側のボーダーの色 */
}

.h2-deco h2::before {
    top: -4px; /* 上側のボーダーの位置調整 */
}

.h2-deco h2::after {
    bottom: -4px; /* 下側のボーダーの位置調整 */
}
.bg-img{
    margin: 0 0 0;
}
.bg-img img{
	height: auto;
	width: 100%;
}


.strengths-img{
	width: 100%;
    height: auto;
    text-align: center;

}
.strengths-img img{
	width: 100%;
	height: auto;
}
.container-img{

}
.container-img-1{
	background-color: #b4952c;
    text-align: end;
    position: relative;
    display: block;
    height: 200px;
}

.container-img img{
    width: 100%;
    height: auto;
    position: absolute;
    top: 0;
    right: 0;
}
.container-text{
}

.ttl{

}
.ttl-sub{
	margin: 80px auto 0;
    width: 100%;
    text-align: center;
    font-size: 14px;
    background-color:var(--main-theme-color);
    padding: 5% 5%;
    color: #fff;
}
.strengths-kariate .ttl-sub {
    margin: 60px auto 0;
    }
.ttl-sub-1 {
	margin: 54px auto 0;
}
.txt{

}
.strengths-tire img{
	margin: 5% auto 0;
}
.container-pc{
	display: none;
	}

.faq {
   	background-color: #d2c69e;
	background-image: url("data:image/svg+xml,%3Csvg width='12' height='16' viewBox='0 0 12 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 .99C4 .445 4.444 0 5 0c.552 0 1 .45 1 .99v4.02C6 5.555 5.556 6 5 6c-.552 0-1-.45-1-.99V.99zm6 8c0-.546.444-.99 1-.99.552 0 1 .45 1 .99v4.02c0 .546-.444.99-1 .99-.552 0-1-.45-1-.99V8.99z' fill='%23ffffff' fill-opacity='0.21' fill-rule='evenodd'/%3E%3C/svg%3E");   
}
main section.access { 
		/*background-color: #ffffff;
		background-image: url("data:image/svg+xml,%3Csvg width='12' height='16' viewBox='0 0 12 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 .99C4 .445 4.444 0 5 0c.552 0 1 .45 1 .99v4.02C6 5.555 5.556 6 5 6c-.552 0-1-.45-1-.99V.99zm6 8c0-.546.444-.99 1-.99.552 0 1 .45 1 .99v4.02c0 .546-.444.99-1 .99-.552 0-1-.45-1-.99V8.99z' fill='%23dddddd' fill-opacity='0.4' fill-rule='evenodd'/%3E%3C/svg%3E");
	*/
	}
.link-text{
	color: #cc0235 !important;
    text-decoration: underline;
}
@media screen and (min-width:460px) and (max-width:768px) {
	.ttl-sub {
    margin: 270px auto 0;
	}
	.ttl-sub-1 {
    margin: 170px auto 0;
	}
	.container-img-1 {
    height: 240px;
	}
	.strengths-kariate .ttl-sub {
    margin: 160px auto 0;
	}
	.payment-item {
    height: 210px;
	}
}
/*-- タブレット／PC用スタイリング --*/
/*@media screen and (min-width:768px) and (max-width:959px) {*/
@media screen and (min-width:768px) {
	.h2-deco h2 {
    	padding: 1% 8%;
		margin: 6% auto 4%;
	}
	main .button-primary, main .button-secondary {
    	margin: 2% auto 4%;
	}

	main section.strengths {
    	padding: 0 0 6%;
	}
	.strengths-wrap{
		display: flex;
		margin: 2% auto 5%;
		max-width: 1100px;
	}	
	.strengths-kariate{
		display: flex;
		flex-direction: row-reverse;
	}
	.strengths-img {
        width: 1200px;
        /*background-color: #fff;*/
        margin: 0 auto;
        height: auto;
    }
	.strengths-img img {
    	width: 100%;

	}
	.container-img-1 {
    	height: 260px;
	}
	.container{
		display: none;
	}
	.container-pc{
		display: block;
		background-color:var(--sub-theme-color);
	}

	.container-pc img{
		width: 100%;
		height: auto;
	}
	/*見出しの高さ調整*/
	.img-near{
		padding-top: 28px;
	}
	.img-kariate{
		padding-top: 60px;
	}
	.img-tire{
		padding-top: 70px;
	}


	.ttl-sub {	
		background-color: inherit;
    	padding: 0;
    	margin: 10px auto 20px;
    	width: 85%;
    	text-align: center;
    	font-size: 15px;
    	color: #fff;
	}
	.strengths-kariate .container-pc{
    	
	}
	.strengths-kariate .container-pc img{
		width: 90%;
		margin: 3% 5% 2%;
	}
	.strengths-kariate .ttl-sub {
    	width: 90%;    
    	margin: 0 auto 20px;
	}
	#jump-service,#jump-features,#jump-faq,#jump-stores {
     height: 140px;
	}	
}
@media screen and (min-width:960px) {

	main section.strengths {
	background-color: #a29254;
	/*background-image: none;*/
	}
}
@media screen and (min-width:1180px) {

}
@media screen and (min-width:1500px) {


}