﻿/* all page */
/* color */
.txt_color1{color: #393939;} /* メインカラー */
.hvr_txt_color2:hover { color: #909090;}

/* background-color */
.bg_color1{background-color: #393939;} /* メインカラー */

/* border-color ※!important */
.border_color1{border-color: #393939;}

/*font*/
body{font-family: 'Noto Sans JP', sans-serif,"游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}
h1, h2, h3, h4, h5, h6 {
    font-weight: bold;
}

.linkStyle{
    color: #333;
    text-decoration: underline;
}


/*contact icon*/
.fa-envelope:before {
    content: "\f075" !important;
}

/* top ----------------*/

/* header */
#logo{
	width: 22.66667%!important;
    transform: translateY(30px);
}
#logo .logo img{
	width: 100% !important;
}
#header_menu{
	width: 38.66667%!important;
}
.index_header #header #header_menu li {
    max-height: 11.5em;
}
.header_info{
	margin-left: 13.66667%;
}
.clone-nav #logo {
    width: 17%!important;
	transform: none;
}

/* main img */
#main_img{
	position: relative;
}
#main_img::before {
    content: '';
    display: inline-block;
    width: 100%;
    height: 80%;
    background-image: url("./Dup/img/catch.png");
    background-size: 34%;
    background-repeat: no-repeat;
    background-position: bottom 15% left 80px;
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 10;
    pointer-events: none;
}

/* main */
main{
	background-image: url("./Dup/img/back2.jpg");
	background-position: center center;
    background-repeat: repeat;
    background-size: auto;
}

/* intro */
#intro {
    height: 400px;
    max-height: 400px;
}

/* contents */
#contents h2 {
    font-size: 40px;
    color: #fff;
    max-height: inherit;
    letter-spacing: 10px;
}
#contents .back_color2::before {
    content: "";
	background-image: url("./Dup/img/shadow.png");
	background-position: bottom;
	background-repeat: no-repeat;
	background-size: 1480px;
    width: 1480px;
    height: 100%;
    position: absolute;
    bottom: -1px;
    right: -350px;
    opacity: 0.3;
}
#contents .back_color2::after {
    background-color: rgba(57,57,57,0.1);
}
#contents .svg_box{
	display: none;
}

/* topcms */
#top_cms .cms_title .title_box {
    background-color: rgba(51,51,51,0.3);
}
#top_cms .cms_title .title_box h2 {
    color: #fff;
}

/* footer */
footer{
    max-width: none !important;
    border-top: 4px double;
}
#footer {
    border-top: none;
}
#logo2 a img{
    width: 100% !important;
}

/* under page */
.all_header #logo {
    width: 14%!important;
    transform: none;
}
#page_title h2 {
    color: #fff;
    max-height: 250px;
}
.cate_list li a {
    padding-bottom: 5px;
    border-bottom: 1px solid;
}

/* cms1 */

/* cms2 */

/* cms3 */

/* cms4 */

/* cms5 */

/* page7 */

/* page8 */

/* page9 */

/* page10 */


/* IE */
@media all and (-ms-high-contrast: none){
    #top_cms .btn{
        padding-top: 0;
    }
    #page8 #tel_contact p a{
        padding-top: 15px;
    }
    #cms_2-a .cate .cate_title{
        padding-top: 10px !important;
    }
    footer #bottom_menu ul li{
        padding-top: 0 !important;
    }
    #page9 .box_wrap .box p a{
        padding-top: 5px !important;
    }
    #page10 .btn{
        padding-top: 0 !important;
    }
    #cms_6-b .cate .cate_title{
        padding: 5px !important;
    }
    #cms_6-b .cate .box_txt2{
        padding: 10px !important;
    }
    #cms_6-a .cate .cate_title{
        padding-top: 10px !important;
    }
    
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
	#logo {
		transform: translateY(0px);
	}
	#logo .logo {
		padding-left: 20px;
		padding-right: 0;
	}
	.clone-nav #logo {
		width: 21%!important;
	}
	#main_img::before {
		background-size: 52%;
		background-position: bottom 20% left 30px;
	}
	#intro {
	    margin-top: 10px;
        margin-bottom: 10px;
        height: auto;
        max-height: inherit;
    }
	#intro #intro_txt {
        -webkit-writing-mode: vertical-tb;
        -moz-writing-mode: vertical-tb;
        -ms-writing-mode: lr-tb;
        -ms-writing-mode: vertical-rl;
        writing-mode: horizontal-tb;
        display: inline-block;
        text-align: left;
        -webkit-text-orientation: upright;
        text-orientation: upright;
        padding-top: 50px;
        padding-bottom: 50px;
    }
    #intro #intro_txt h2 {
        display: block;
        margin: 0 auto;
        margin-bottom: 25px;
        text-align: center;
    }
    
	#contents .back_color2::before {
		background-size: 1000px;
		width: 1000px;
		right: -480px;
	}
	.all_header #logo {
        width: 20%!important;
    }
	
}
/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
	#logo {
		width: 34.66667%!important;
	}
	#logo .logo {
		padding-left: 0;
	}
	.header_info {
		margin-left: 1.66667%;
	}
	.clone-nav #logo {
		width: 36%!important;
	}
	.clone-nav .header_info {
		margin-left: auto;
	}
	#main_img::before {
		background-size: 66%;
		background-position: bottom 20% left 10px;
	}
	#intro{
	    margin-top: 10px;
	    margin-bottom: 10px;
	}
	#contents .back_color2::before {
		background-size: 1070px;
		width: 1070px;
		right: -500px;
		background-position: bottom -70px right 10px;
		z-index: 3;
        opacity: 0.2;
	}
    #logo2 {
        margin-top: 30px;
    }
	.all_header #logo {
        width: 33%!important;
    }
	
}

/*20211112公開後修正*/
#header_menu{
    width: 29.66667%!important;
}
.header_info{
    width: 30%!important;
}
.clone-nav .header_info .fax{
    margin-right: 0;
}
.clone-nav .header_info .mobile{
    margin-right: 35px;
}
.clone-nav .header_info{
    width: 30%!important;
}
.all .header_info{
    width: 50%!important;
}
/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
    .clone-nav .header_info .tel{
        margin-right: 0;
    }
    .clone-nav .header_info .fax{
        margin-right: 0;
    }
    .clone-nav .header_info .mobile{
        margin-right: 0;
    }
    
    .all .header_info{
        width: 41%!important;
    }
}


