
/** LOGO & PHONE
 **************************************************************** **/

#topNav {
    margin-top: 20px;
    font-family: 'Noto Serif JP', sans-serif;
}

#topNav {
	display:block;
    left:0;
    right:0;
    top:0;
	background:#fff;
	position:relative;
	z-index:10;
/*
	-webkit-box-shadow: 0 4px 0 rgba(0, 0, 0, 0.04);
	   -moz-box-shadow: 0 4px 0 rgba(0, 0, 0, 0.04);
		 -o-box-shadow: 0 4px 0 rgba(0, 0, 0, 0.04);
			box-shadow: 0 4px 0 rgba(0, 0, 0, 0.04);*/
}

#topNav a.logo{
    display:inline-block;
	text-align:left;
	margin: 5px 0 20px 20px;
    float: left;
}

#topNav a.logo img{
    width: 400px;
   
}

@media only screen and (max-width: 479px) {
    
     #topNav {
        margin-top: 10px;
    }
    
    #topNav a.logo{
        display:inline-block;
		text-align:left;
		margin:8px 5px;
		float:none;
        float: left;
        width: 250px;
    }
    
    #topNav a.logo img{
        width: 250px;
        margin-top: 5px;
        margin-bottom: 5px;
    }
}

.phone .hd-phone{
    width: 310px;
    margin-right: 20px;
}

@media only screen and (max-width: 990px) {

    .phone .hd-phone{
        display: none;
    }
}

/** Menu
 **************************************************************** **/

#topNav .nav-pills > li > a{
    background-color: #FFF; 
}


#topNav .nav-pills > li > a:hover, 
#topNav .nav-pills > li > a:focus,
#topNav .nav-pills > li.active > a, 
#topNav .nav-pills > li.active > a:hover, 
#topNav .nav-pills > li.active > a:focus {
    /*background-color: #D6F8F8;*/
    color: #C52329;
}


#topNav div.navbar-collapse {
	padding:0;
}
#topNav ul.nav > li {    
	text-align:center;
	position:relative;
	margin:0;
    width:16.666%;
}

#topNav ul.nav > li a {
	color:#62333C;
    font-weight: 500;
	padding: 20px 15px;
	position: relative;
	text-decoration: none;
	font-size:15px;
	line-height:1px;
	display:block;
    white-space: nowrap;
    /*background: #CCC;*/
}

#topNav ul.nav > li >a::before {
    content:' ';
	background: url(/assets/img/core/icon_nav.svg);
	position: relative;
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-right: 5px;
    top: -2px;
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
}

#topNav ul.nav>li:last-child {
	/*border-right:#eee 1px solid;*/
}


#topNav ul.nav > li:hover > a:before,
#topNav ul.nav > li.active > a:before {
  background: url(/assets/img/core/icon_nav_o.svg);
     width: 20px;
    height: 20px;
    top: -2px;
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

/*
#topNav ul.nav > li:hover > a::after,
#topNav ul.nav > li.active > a::after{
    font-family: icofont;
    content: "\ea6a";
	color: #5DABBF;
	height: 2px;
    width: 100%;
	left: 0;
    bottom: 10px;
	position: absolute;
    font-size: 20px;
}
*/


#topNav ul.nav > li a,
#topNav ul.nav > li:hover > a:before,
#topNav ul.nav > li.active > a:before {
    -webkit-transition: all 700ms ease 0s;
    transition: all 700ms ease 0s;
    text-decoration: none;
    outline: none;
    /*-webkit-transition: 0.3s ease-in-out;
    -moz-transition: 0.3s ease-in-out;
    -o-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;*/
}




/* mobile menu */

#topNav button.btn-mobile {
	display:none;
}
	#topNav button.btn-mobile {
		color:#fff;
		display: none;
		background:#333;
		padding:6px 10px;
		margin-top:8px;
		margin-bottom:3px;


		-webkit-border-radius: 0;
		   -moz-border-radius: 0;
				border-radius: 0;
	}	
	#topNav button.btn-mobile i {
		padding:0; margin:0;
		font-size:21px;
	}



/** mobile Only
 **************************************************************** **/


.hide_pc{
        display: none;
    }




/** Responsive Top Nav
 **************************************************************** **/
@media only screen and (max-width: 1166px) {
	#topNav ul.nav>li a {
		padding: 15px 20px;
	}

}

@media only screen and (max-width: 990px) {
	.navbar-collapse {
		max-height:100%;
	}
	#topNav .container {
		padding:0;
		margin:0;
	}

 	#topNav button.btn-mobile {
		display:block;
		float:right;
		margin-right:10px;
	}

	#topNav nav.nav-main {
		background-color:#fff;
	}
	#topNav div.nav-main-collapse,
	#topNav div.nav-main-collapse.in {
		width: 100%;
		margin:20px 0 0 0;
        border-top: rgba(0,0,0,0.1) 1px solid;
	}
	#topNav div.nav-main-collapse {
		float: none;
		overflow-x:hidden;
	}
	#topNav div.nav-main-collapse.collapse {
		display: none !important;
	}
	#topNav div.nav-main-collapse.in {
		display: block !important;
	}
	#topNav div.nav-main-collapse {
		position: relative;
	}

	#topMain > li > a > span {
		display:none !important;
	}
    
	#topMain li {
		display:block !important;
		float:none;
		text-align:left;

		-webkit-border-radius: 0;
		   -moz-border-radius: 0;
				border-radius: 0;
	}
    
    #topNav ul.nav > li {
        width:100%;
    }
	#topMain > li >a {      
		text-align:left;
		border:0;
		border-bottom:rgba(0,0,0,0.1) 1px solid;
         
		/*-webkit-border-radius: 0;
		   -moz-border-radius: 0;
				border-radius: 0;*/
        
	}
	#topMain > li:hover,
	#topMain > li:hover > a {
		border-top:0 !important;
	}

    
    #topNav ul.nav > li:hover > a:before,
    #topNav ul.nav > li.active > a:before {
        display: none;
    }
    
    #topNav ul.nav > li:hover > a::after,
    #topNav ul.nav > li.active > a::after{
        display: none;
    }
    
     /*#topNav ul.nav > li > a:before,*/
    #topNav ul.nav > li:after{
        font-family: icofont;
		content: "\eaca";
		position: absolute;
		font-size: 15px;
		right: 20px;
		top: 13px;
		color:#999;
	}
	
}

@media screen and (max-width: 768px) {
    .hide_mobile {
		display:none;
	}
    .hide_pc{
        display: none;
    }
}

@media only screen and (max-width: 990px) {
    
    .hide_pc{
        display: block;
    }
}


@media only screen and (max-width: 479px) {
    
   
 	#topNav button.btn-mobile {
		margin-right:5px;
        float: right;
        
	}

	/*#topBar a.logo {
		display:inline-block;
		text-align:left;
		margin:6px 0;
		float:none;
        float: left;
	}
*/
	.hide_mobile {
		display:none;
	}
    
    .hide_pc{
        display: block;
    }
}



/* 
========================================================================== 
PAGE HEAD VISUAL
========================================================================== 
*/
#page-header {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	height: 200px;
    z-index: 102;
    overflow: hidden;
	margin-top: 0px;
}

#page-header .head-wrap{
    height: 200px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-right: 5%;
     /*display: table-cell;
    vertical-align: middle;
    text-align: right;*/
}



@media screen and (max-width: 768px) {
    
    #page-header {
        height: 150px;
    } 
    #page-header .head-wrap{
        height: 150px;
    }
}

@media only screen and (max-width: 479px) {
    
    #page-header {
          height: 100px;
    } 
    #page-header .head-wrap{
        height: 100px;
    }
    
    #page-header .head-wrap img{
        display: none;
    }

}

.hd-temp{
	width: 100%;
	background-size: cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-repeat: no-repeat;
	background-position: center 0px;
    
    /*overflow: hidden;*/
 }
 
 .hd-v1{
	background-image: url(/assets/img/bg/hd_v1.jpg);
	/*filter: grayscale( 10% );
	opacity:1.0;*/
 }

 .hd-v2{
	background-image: url(/assets/img/bg/hd_v2.jpg);
 }
 .hd-v3{
	background-image: url(/assets/img/bg/hd_v3.jpg);
 }
 .hd-v4{
	background-image: url(/assets/img/bg/hd_v4.jpg);
 }

 
/* .hd-cell{
	background-image: url(/assets/img/bg/hd_cellutone.jpg);
	filter: grayscale( 10% );
	opacity:1.0;
 }*/
