﻿@import url('https://fonts.googleapis.com/css2?family=Anton&display=swap');

/* ----------　all　---------- */
.linkStyle{
	color:#bad540;
}
.linkStyle:hover{
	color:#bad540;
	opacity: 0.5;
	transition: all 0.5s;
}

/* color */
body,.txt_color_nomal{color: #1a1a1a!important;}
.txt_color1{color: #0b186f!important;} /* メインカラー */
.txt_color2{color: #bad540!important;} /* サブカラー */
.txt_color3{color: #3c468c!important;} /* アクセントカラー1 */
.txt_color4{color: #e3eeb3!important;} /* アクセントカラー2 */


/* background-color */
.bg_color1{background-color: #0b186f!important;} /* メインカラー */
.bg_color2{background-color: #bad540!important;} /* サブカラー */
.bg_color3{background-color: #3c468c!important;} /* アクセントカラー1 */
.bg_color4{background-color: #e3eeb3!important;} /* アクセントカラー2 */



/* border-color ※!important */
.border_color1{border-color: #0b186f!important;}
.border_color2{border-color: #bad540!important;}
.border_color3{border-color: #3c468c!important;}
.border_color4{border-color: #e3eeb3!important;}



/* hover ---------------------------------------------------------------------------------------------*/
/* color */
.hvr_txt_color_nomal:hover{color: #1a1a1a!important;}
.hvr_txt_color1:hover{color: #0b186f!important;} /* メインカラー */
.hvr_txt_color2:hover{color: #bad540!important;} /* サブカラー */
.hvr_txt_color3:hover{color: #3c468c!important;} /* アクセントカラー1 */
.hvr_txt_color4:hover{color: #e3eeb3!important;} /* アクセントカラー2 */


/* background-color */
.hvr_bg_color1:hover{background-color: #0b186f!important;} /* メインカラー */
.hvr_bg_color2:hover{background-color: #bad540!important;} /* サブカラー */
.hvr_bg_color3:hover{background-color: #3c468c!important;} /* アクセントカラー1 */
.hvr_bg_color4:hover{background-color: #e3eeb3!important;} /* アクセントカラー2 */



/* border-color ※!important */
.hvr_border_color1:hover{border-color: #0b186f!important;}
.hvr_border_color2:hover{border-color: #bad540!important;}
.hvr_border_color3:hover{border-color: #3c468c!important;}
.hvr_border_color4:hover{border-color: #e3eeb3!important;}


main.blur {
    background-image: url(Dup/img/bg1.png);
}



/* nav */

.overlay:before {
    background-color: rgba(11,24,111,0.85)!important;
}

.overlay .overlay-nav .bottom a, .overlay ul.sp_tel li a {
    color: #1a1a1a!important;
    background-color: #bad540!important;
}

.overlay .overlay-nav .bottom a:hover, .overlay ul.sp_tel li a:hover {
    color: #ffffff!important;
    background-color: #3c468c!important;
}

#logo {
    margin-left: 15px;
}


/* footer */


footer #footer_info {
    background-color:#ffffff!important;
}

.tel_bt a, .contact_bt a {
    color: #1a1a1a!important;
    background-color: #bad540!important;
}

.tel_bt a:hover, .contact_bt a:hover {
    color: #ffffff!important;
}

/* ----------　TOP　---------- */

/* main-img */


#main_img {
    height: 90vh;
    background-image: url('/Dup/img/top1.jpg');
    background-position: center;
    background-repeat: no-repeat;
}

.passing.move {
    position: absolute;
    top: 55%;
    left: 3%;
}

.passing.move .passing-txt {
    font-size: 80px;
    font-weight: bold;
    color: #3c468c;
}




/*cachcopy*/

.passing .passing-bar {
    position: relative;
    display: inline-block;
    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}
.passing .passing-bar:before {
    content: '';
    display: inline-block;
    width: 0;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    background: #ffffff;
}
.passing.move .passing-bar:before {
    -webkit-animation: passing-bar 1s ease 0s 1 normal forwards;
    animation: passing-bar 1s ease 0s 1 normal forwards;
}
.passing .passing-txt {
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
	padding: 5px 15px;
}
.passing.move .passing-txt {
    -webkit-animation: passing-txt 0s ease .5s 1 normal forwards;
    animation: passing-txt 0s ease .5s 1 normal forwards;
}
@-webkit-keyframes passing-bar{
	0% {left: 0;right: auto;width: 0;}
	50% {left: 0;right: auto;width: 100%;}
	51% {left: auto;right: 0;width: 100%;}
	100% {left: auto;right: 0;width: 0;}
}
@keyframes passing-bar{
	0% {left: 0;width: 0;}
	50% {left: 0;width: 100%;}
	51% {left: 0;width: 100%;}
	100% {left: 100%;width: 0;}
}
@-webkit-keyframes passing-txt{
	0% { opacity: 0; }
	50% { opacity: 0; }
	100% { opacity: 1; }
}
@keyframes passing-txt{
	0% { opacity:0; }
	50% { opacity:0; }
	100% { opacity:1; }
}


/* top */

.intro_title1 {
    font-size: 35px;
}

#intro .intro_photo h2 {
    font-family: 'Anton', sans-serif;
    z-index: 0;
    top: -160px;
    font-size: 150px;
    letter-spacing: 0.15em;
    opacity: 0.2;
    left: -30%;
    text-align: right;
    width: 100vw;
}

#intro .rotate_txt span {
    transform: none!important;
    display: inline;
}



.top_title_color {
    background-color: #999999!important;
}

.top_con_title .slash:before, .top_con_title .slash:after {
        background-color: #bad540!important;
}

#contents_wrap {
    padding: 0!important;
}

.con_box {
    padding: 5% 10%;
    margin-bottom: 50px!important;
    position: relative;
}

.box2 {
    background-color: #0b186f!important;
}

.box2 .slash {
    color: #bad540!important;
}

.box2 .slash2:before, .box2 .slash2:after {
    background-color: #ffffff;
}

#contents .box2 .con_title, .box2 .con_txt {
    color: #ffffff;
}

.box2 .modal-open .more_item {
    background-color: #bad540!important;
}

.box2 .modal-open .txt {
    background-color: transparent!important;
}

.box2 .modal-open .more_item:hover {
    background-color: #e3eeb3!important;
}

.modal_title1 {
    display: none;
}

#contents .con_title {
    font-size: 30px;
    font-weight: bold;
}



.box-bg{
    width: 100%;
    font-size: 150px;
    position: absolute;
    top:0;
    left: 2%;
    font-weight: bold;
    z-index: 0;
    font-family: 'Anton', sans-serif;
    opacity: 0.1;
}

.box2 .box-bg{
    width: 100%;
    font-size: 150px;
    position: absolute;
    top:0;
    left: -2%;
    font-weight: bold;
    z-index: 0;
    font-family: 'Anton', sans-serif;
    opacity: 0.1;
    text-align: right;
    color: #ffffff;
}


/* top-cms */

.cms_title p {
    color: #bad540!important;
}

#top_cms .cms_title h3 {
    font-size: 30px;
}


/* ----------　下層ページ　---------- */


#page_title_img {
    background-image: url('/Dup/img/sub-top.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
}

#page_title_img .scr {
    color: #0b186f!important;
}

#page_title_img .scroll_d > span {
    background-color: #0b186f!important;
}

/* 会社情報 */
/* お問い合わせ */
/* プライバシーポリシー */
/* サイトマップ */


/*-------------------------------------------------------
			          タブレット
-------------------------------------------------------*/
@media screen and (max-width: 768px){
    
        #main_img {
    height: 60vh;
    background-image: url(/Dup/img/top1.jpg);
    background-position: center;
}
    
    .passing.move .passing-txt {
    font-size: 50px;
}
    
#intro .intro_photo h2 {
    font-size: 100px;
    top: -120px;
}

#intro .intro_photo .intro_img1 img {
        transform: translate(-40%,-50%);
}
    
.con_box {
    padding: 10% 5%;
} 

.box2 {
    padding:15% 5%;
}
    
.box-bg, .box2 .box-bg{
    font-size: 100px;
    position: absolute;
    top:60%;
    font-weight: bold;

}


    
}

/*-------------------------------------------------------
		            	スマホ
-------------------------------------------------------*/
@media screen and (max-width: 667px){
    
    
    #header {
        padding: 15px;
    }
    
    #logo {
    margin-left: 0;
}
    
    #main_img {
    height: 70vh;
    }


    .passing.move {
    position: absolute;
    top: 70%;
    left: 3%;
}
    
    .passing.move .passing-txt {
    font-size: 30px;

}
    
    .intro_title1 {
    text-align: left;
    font-size: 25px;
    margin-bottom: 20px;
    }
    
    #intro .intro_photo h2 {
    font-size: 55px;
} 
    
    #contents .con_title {
        font-size: 25px;
    }
    
    #top_cms .cms_title h3 {
        font-size: 25px;
    }
    
    .box-bg {
        font-size: 55px;
        top: 45%;
    }
    
    .box2 .box-bg {
        font-size: 55px;
        top: 50%;
    }
    
    .modal-box {
        top: 15%;
    }
    
    .mordal_title2 {
        text-align: left;
    }
    
#page_title_img {
    height: 180px;
}



    #page_title_img .scr {
        font-weight: bold;
        text-shadow: 0 0 10px rgb(255 255 255);
}

}