﻿/* 1536 , 1530 × 735 ,1366 *//* 上記画面幅でも崩れていないか確認 */

/* 修正した場合→各項目の一番下に日付をコメントアウトして追記 */


/*■■　ALL　■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
.linkStyle{
	color:var(--color1);
}
.linkStyle:hover{
	color:var(--color1);
	opacity: 0.7;
	transition: all 0.5s;
}
.top_cms_item:first-child{
    padding: 0px 3% 100px 3%;
}

#wrap{
    overflow: hidden;
}

#page_title::before{
    background: rgb(41 53 44 / 64%);
}

footer .copy{
    padding: 4px 0 2px 0;
}

/* カルーセル */
.cursor, .follower{
	border-radius: 50%;
	position: fixed;
	top: 0;
	left: 0;
	pointer-events: none;
	z-index: 10;
	transition: 0.3s;
	transition-property: opacity,background,width,height,transform
}
.cursor {
	width: 8px;
	height: 8px;
	z-index: 11;
	background-color: #333;
}
.cursor.is-active{
	background-color: #9b744d;
}
.follower {
	width: 40px;
	height: 40px;
	border: solid 1px #333;
}
.follower.is-active{
	transform: scale(1.8,1.8);
	border: solid 1px #9b744d;
}

/* ---------------------------　タブレット　-------------------------- */
@media screen and (max-width: 768px){

}

/* --------------------------　スマホ　-------------------------- */
@media screen and (max-width: 667px){
.index .main_header h1{
    max-width: 150px;
}
}



/*■■　FV　■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
.main_img{
    border-radius: 0 0 50px 0;
}
.fv_txt01{
    background-color: var(--color4);
    padding: 3% 13% 3% 4%;
    border-radius: 50px;
    position: absolute;
    width: 20%;
    right: -10%;
    top: 61%;
}
.fv_txt02{
    position: absolute;
    z-index: 3;
    left: 3%;
    top: 5%;
    width: 37%;
}
.fv_img01{
    position: absolute;
    width: 16%;
    bottom: -10%;
    right: -14%;
}

/* ---------------------------　タブレット　-------------------------- */
@media screen and (max-width: 768px){
.fv_txt01 {
    background-color: var(--color4);
    padding: 3% 31% 3% 4%;
    border-radius: 50px;
    position: absolute;
    width: 27%;
    right: -8%;
    top: 67%;
}
.fv_txt02 {
    position: absolute;
    z-index: 3;
    left: 3%;
    top: 5%;
    width: 47%;
}
.fv_img01 {
    position: absolute;
    width: 21%;
    bottom: -18%;
    right: 1%;
}
}

/* --------------------------　スマホ　-------------------------- */
@media screen and (max-width: 667px){
.main_img{
    min-height: 120vw;
}
    .fv_txt01 {
        background-color: var(--color4);
        padding: 3% 38% 3% 4%;
        border-radius: 10px;
        position: absolute;
        width: 41%;
        right: -5%;
        top: 72%;
    }
    .fv_txt02 {
        position: absolute;
        z-index: 3;
        left: 3%;
        top: 5%;
        width: 68%;
    }
    .fv_img01 {
        position: absolute;
        width: 33%;
        bottom: -15%;
        right: 1%;
    }
}



/*■■　TOP　■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
.item01{
    position: absolute;
    width: 17%;
    z-index: 3;
    left: -5%;
    top: -27%;
}
.item02{
    position: absolute;
    width: 20%;
    z-index: 3;
    right: -4%;
    top: 66%;
}
.item03{
    position: absolute;
    width: 16%;
    z-index: 3;
    right: -3%;
    top: -29%;
}
.item04{
    position: absolute;
    width: 14%;
    z-index: 3;
    left: -3%;
    top: -26%;
}
.about_txt01, .about_txt02{
    width: 80%;
}
.item05{
position: absolute;
    width: 10%;
    right: 8%;
    top: 20%;
}
.item06 {
    position: absolute;
    width: 10%;
    right: 47%;
    top: -27%;
    z-index: 0;
}
.modal_wrap .bg_color4{
    opacity: 0.9;
}
.intro_txt_sp{
    display: none;
}

/* ---------------------------　タブレット　-------------------------- */
@media screen and (max-width: 768px){
.item01 {
    position: absolute;
    width: 27%;
    z-index: 3;
    left: 0;
    top: -36%;
}
.item02 {
    position: absolute;
    width: 25%;
    z-index: 3;
    right: 0;
    top: 85%;
}
.item04 {
    position: absolute;
    width: 20%;
    z-index: 3;
    left: 0;
    top: -12%;
}
.item03 {
    position: absolute;
    width: 20%;
    z-index: 3;
    right: 0;
    top: -20%;
}
.item05 {
        position: absolute;
        width: 23%;
        right: -2%;
        top: 19%;
}
.item06 {
    position: absolute;
    width: 24%;
    right: 20%;
    top: -25%;
    z-index: 0;
}
}

/* --------------------------　スマホ　-------------------------- */
@media screen and (max-width: 667px){
.item01, .item02{
    display: none;
}
    .item04 {
        position: absolute;
        width: 31%;
        z-index: 3;
        left: 0;
        top: -7%;
    }
    .item03 {
        position: absolute;
        width: 36%;
        z-index: 3;
        right: 0;
        top: -71%;
    }
.item05 {
        position: absolute;
        width: 28%;
        right: -1%;
        top: 24%;
}
.item06 {
    position: absolute;
    width: 24%;
    right: 70%;
    top: -12%;
    z-index: 0;
}
.intro_txt{
    display: none;
}
.intro_txt_sp{
    display: block;
    width: 85%;
    margin: 0 auto;
}
}



/*■■　下層ページ　■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/


/* ---------------------------　タブレット　-------------------------- */
@media screen and (max-width: 768px){

}

/* --------------------------　スマホ　-------------------------- */
@media screen and (max-width: 667px){

}


