@charset "utf-8";
/* 1536 , 1530 × 735 ,1366 *//* ←記画面幅でも崩れていないか確認 */

/* カテゴリリンクの飛び先位置の数値を適宜調整してください */

/* 修正した場合→各項目の一番下に日付をコメントアウトして追記 */


/*■■　ALL　■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/

#logo {
    width: 200px;
}

#footer_contact {
    z-index: 0;
}

#footer_contact:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-color: var(--color3);
    opacity: 0.5;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}

#header {
    background-color: rgba(255,255,255,0.6)!important;
}

#header_contact a.btn_back {
    background-color: var(--color1);
}

#header_contact span{
    color: #ffffff!important;
}

#header_contact a.btn_back:hover {
    background-color: rgba(238,7,40,0.5);
}



/* ---------------------------　タブレット　-------------------------- */
@media screen and (max-width: 768px){
    
#footer_contact p:last-of-type .c-btn {
    padding: 30px 100px;
}

}

/* --------------------------　スマホ　-------------------------- */
@media screen and (max-width: 667px){

#logo {
    width: 120px;
    margin: 0px auto 0px 10px;
}

    #footer_contact p:last-of-type .c-btn {
        padding: 30px 40px;
    }

}



/*■■　FV　■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/

#vegas {
    height: 95vh;
    background-color: var(--color2);
    max-height: 900px;
}

.cach_copy {
    z-index: 3;
}

.fv_ilu1, .fv_ilu2, .fv_ilu3, .fv_ilu4 {
    pointer-events: none;
}

.fv_ilu1 img, .fv_ilu2 img, .fv_ilu3 img, .fv_ilu4 img {
    min-width: 500px;
}

.fv_ilu2 {
    right: -5%;
    top: -10%;
}

.fv_ilu3 {
    bottom: -5%;
    left: 0%;
}

.fv_ilu4 {
        right: 2%;
    bottom: -20%;
    width: 30% !important;
} 

.anim_box .item{
	transform: translateY(20px);
	transition: transform 1.5s ease, opacity 2s;
	transition-property: opacity,transform;
	opacity: 0;
}
.anim_box .item.start{transform: translateY(0);opacity: 1;}

/* ---------------------------　タブレット　-------------------------- */
@media screen and (max-width: 768px){

#vegas {
    height: 65vh;
}

.fv_ilu1 img, .fv_ilu2 img, .fv_ilu3 img, .fv_ilu4 img {
    min-width: initial;
}

.fv_ilu1 {
    width: 50% !important;
    left: -10%;
}

.fv_ilu3 {
    bottom: -10%;
    left: -3%;
}

.fv_ilu4 {
    right: 3%;
    bottom: -5%;
    width: 35% !important;
}

}

/* --------------------------　スマホ　-------------------------- */
@media screen and (max-width: 667px){

#vegas {
        height: 80vh;
    max-height: 550px;
}

    .fv_ilu1 {
        width: 60% !important;
        left: -10%;
        top: 5%;
    }

.fv_ilu2 {
    right: -5%;
    top: 5%;
    width: 45% !important;
}

.fv_ilu3 {
    bottom: -1%;
    left: -3%;
    width: 50% !important;
}

.fv_ilu4 {
    right: 2%;
    bottom: 0%;
    width: 40% !important;
}


}



/*■■　TOP　■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/

.intro_title {
    font-size: clamp(20px, 5vw, 100px);
    left: 0;
    right: 0;
    top: 6%;
    margin: 0 auto;
    text-align: center;
    z-index: 1;
}

#top_message_wrap{
    position: relative;
    z-index: 0;
}

#top_message_wrap:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-image: url(/Files/img/bg_car.png);
    background-position: center;
    background-size: 90%;
    background-repeat: no-repeat;
    background-attachment: fixed;
    z-index: -1;
}

#top_message h2 {
    font-size: 25px;
}

#top_message {
    background-color: rgba(255,255,255,0.5);
}

#top_message {
    padding: 130px 50px 130px;
}

#top_contents1 h3::before, #top_contents2 h3::before {
    opacity: 0.3;
    color: #ffffff;
}

#top_message .c-btn {
    padding: 20px 150px;
}

/* ---------- loopSlider ---------- */
.loopSliderWrap{
    top: 0;
    left: 0;
    height: 450px;
}
.loopSlider {
    margin: 0 auto;
    height: 450px;
    text-align: left;
    position: relative;
    overflow: hidden;
}
.loopSlider .ul {
    height:450px;
    float: left;
    overflow: hidden;
}
.loopSlider .ul .li {
    width: 450px;
    height: 450px;
    float: left;
    display: inline;
    overflow: hidden;
	position: relative;
	box-sizing: border-box;
	padding: 0;
}
.loopSlider .ul .li img{
    border-radius: 0;
}
.loopSliderWrap:after {
    content: "";
    display: none;
    clear: none;
}

#top_cms{
    position: relative;
    z-index: 1;
}




/* ---------------------------　タブレット　-------------------------- */
@media screen and (max-width: 768px){

#top_contents1 h3::first-letter, #top_contents2 h3::first-letter {
    font-size: 130%!important;
    color: var(--color1);
}

#top_conveyor,.loopSliderWrap,.loopSlider,.loopSlider .ul,.loopSlider .ul .li{
	height: 280px;
}
.loopSlider .ul .li{
    width: 280px;
}
#top_conveyor {
    padding-bottom: 0;
    padding-top: 0;
}

}

/* --------------------------　スマホ　-------------------------- */
@media screen and (max-width: 667px){

#top_message {
    padding: 50px 20px 50px;
}

#top_message .c-btn {
    padding: 20px 30px;
}

#top_message_wrap::before {
	position: absolute;
	content: "";
	left: 0;
        top: 3%;
	width: 100%;
	height: 80px;
	background-image: url("../img/sp_com.png");
	background-size: auto 100%;
	background-position-y: 0;
	background-position-x: 0;
	background-repeat: repeat-x;
	animation: loop 30s linear infinite;
}
@keyframes loop {
	0% {background-position-x: 0;}
	100% {background-position-x: -1000px;}
}

#top_message h2 {
    font-size: 28px;
    text-align: center;
    line-height: 1.75;
}

#top_conveyor,.loopSliderWrap,.loopSlider,.loopSlider .ul,.loopSlider .ul .li{
	height: 179px!important;
}
.loopSlider .ul .li{
    width: 179px;
}


}



/*■■　下層ページ　■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
/*カテゴリリンクの飛び先位置を調整する*/
/* --- PC --- */
:root {
--header-height: 130px;
}
/* --- スマートフォン --- */
@media screen and (max-width: 667px){
:root {
--header-height: 100px;
}
}

.v_type3 .cate_box{border: 1px solid var(--color3);}
.v_type3 .box_title1{color: var(--color3);}

.youtube_box{
  position: relative;
  width: 80%;
  aspect-ratio: 16 / 9;
margin-bottom: 50px;
}

.youtube_box iframe{
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}

.form_wrap input, .form_wrap textarea {
        background-color: #eeeeee!important;
}

.form_wrap #submit input {
    background-color: var(--color1)!important;
}

#wrap.sub_page{
    z-index: 0;
}

#wrap.sub_page:before {
content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-image: url(/Files/img/bg_car.png);
    background-position: center;
    background-size: 80%;
    background-repeat: no-repeat;
    background-attachment: fixed;
    z-index: -1;
    opacity: 0.6;
}


/* ---------------------------　タブレット　-------------------------- */
@media screen and (max-width: 768px){

}

/* --------------------------　スマホ　-------------------------- */
@media screen and (max-width: 667px){

}