body {
    font-family: "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3", "Noto Sans JP", メイリオ, Meiryo, Arial, sans-serif;
}

a {
    transition: 0.2s all ease-in-out;
}

/* ヘッダ */
header {
	padding:0 0 0 0;
	width:100%;
	background-color:#FFF;
}

header .hd-ttl{
	text-align:left;
}

header .hd-ttl .container{
	width:1000px;
	margin:0 auto;
    padding: 10px 0;
    position: relative;
}

header .hd-ttl h1 {
    height: 56px;
    width: 212px;
}

header .hd-ttl h1 a{
	display:block;
	padding:0;
    background: url("../images/common/h1.png") no-repeat 0 0;
    background-size: 100% auto;
    width: 100%;
    height: 100%;
    overflow: hidden;
    text-indent: -9999px;
}


/*--------*/
header .hd-ttl .hd-menu {
    /*
    background: #000000;
    color: #FFFFFF;
    */
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
   }
    
   header .hd-ttl .hd-menu ul {
    display: flex;
    justify-content: center;
    position: relative;
   }
    
   header .hd-ttl .hd-menu ul li {
    display: block;
    margin: 0;
    padding: 0 0.5em;
    font-size: 16px;
    line-height: 1.2;
    position: relative;
   }
    
   header .hd-ttl .hd-menu ul li::before,
   header .hd-ttl .hd-menu ul li:first-of-type::after{
    content: "";
    display: block;
    background: #000000;
    height: 1em;
    width: 1px;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
   }
    
   header .hd-ttl .hd-menu ul li:first-of-type::after {
    left: 0;
    right:auto;
   }
    
   header .hd-ttl .hd-menu ul li a {
    display: block;
    color: #000000;
    text-decoration: none;
    padding: 0.5em 1em;
    position: relative;
    /*transition: none;*/
   }
    
   header .hd-ttl .hd-menu ul li a:hover {
    color: #ff7e0f;
   }
    
   header .hd-ttl .hd-menu ul li.estimate a::before,
   header .hd-ttl .hd-menu ul li.contact a::before {
    content: "";
    display: inline-block;
    position: absolute;
    left: 1em;
    top: 50%;
    transform: translateY(-50%);
   }
    
   header .hd-ttl .hd-menu ul li.estimate a {
    padding-left: calc(1.5em + 19px);
   }
    
   header .hd-ttl .hd-menu ul li.estimate a::before {
    background: url("../images/common/icon_estimate_bk.png") no-repeat center center;
    background-size: contain;
    width: 19px;
    height: 24px;
   }
    /*
   header .hd-ttl .hd-menu ul li.estimate a:hover::before {
    background: url("../images/common/icon_estimate_or.png") no-repeat center center;
    background-size: contain;
   }
    */
    
   header .hd-ttl .hd-menu ul li.contact a {
    padding-left: calc(1.5em + 24px);
   }
    
   header .hd-ttl .hd-menu ul li.contact a::before {
    background: url("../images/common/icon_mail_bk.png") no-repeat center center;
    background-size: contain;
    width: 24px;
    height: 24px;
   }
    /*
   header .hd-ttl .hd-menu ul li.contact a:hover::before {
    background: url("../images/common/icon_mail_or.png") no-repeat center center;
    background-size: contain;
   }
    */

    header .hd-ttl .hd-menu ul li a:hover {
        color: #ff7e0f;
       }

@media screen and (max-width: 812px) {
    /* ヘッダ */
    header .hd-ttl{
        text-align:left;
    }

    header .hd-ttl .container{
            width:100%;
            margin:0 auto;
        padding: 5px 0;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    header .hd-ttl h1 {
    height: 52px;
    width: 50%;
    max-width: 159px;
    margin-left: 15px;
    }

    header .hd-ttl h1 a {
        background-position: center;
    }


/*--------*/
header .hd-ttl .hd-menu {
    /*
    background: #000000;
    color: #FFFFFF;
    */
    /*
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    */
    margin-right: 15px;
    margin-left: 15px;
   }
    
   header .hd-ttl .hd-menu ul {
    display: flex;
    justify-content: center;
    position: relative;
   }
    
   header .hd-ttl .hd-menu ul li {
    display: block;
    margin: 0;
    padding: 0 0.4em;
    font-size: 0.875rem;
    line-height: 1.2;
    position: relative;
   }
    
   header .hd-ttl .hd-menu ul li::before,
   header .hd-ttl .hd-menu ul li:first-of-type::after{
    content: "";
    display: block;
    background: #000000;
    height: 1em;
    width: 1px;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
   }
    
   header .hd-ttl .hd-menu ul li:first-of-type::after {
    left: 0;
    right:auto;
   }
    
   header .hd-ttl .hd-menu ul li a {
    display: block;
    color: #000000;
    text-decoration: none;
    padding: 0.5em 0.2em;
    position: relative;
    /*transition: none;*/
    white-space:nowrap;
   }
    
   header .hd-ttl .hd-menu ul li a:hover {
    color: #ff7e0f;
   }
    
   header .hd-ttl .hd-menu ul li.estimate a::before,
   header .hd-ttl .hd-menu ul li.contact a::before {
    content: "";
    display: inline-block;
    position: absolute;
    left: 0.4em;
    top: 50%;
    transform: translateY(-50%);
   }
    
   header .hd-ttl .hd-menu ul li.estimate a {
    padding-left: calc(0.8em + 12px);
   }
    
   header .hd-ttl .hd-menu ul li.estimate a::before {

    background-size: contain;
    width: 12px;
    height: 16px;
   }
    /*
   header .hd-ttl .hd-menu ul li.estimate a:hover::before {
    background: url("../images/icon_estimate_or.png") no-repeat center center;
    background-size: contain;
   }
    */
    
   header .hd-ttl .hd-menu ul li.contact a {
    padding-left: calc(0.8em + 16px);
   }
    
   header .hd-ttl .hd-menu ul li.contact a::before {

    background-size: contain;
    width: 16px;
    height: 16px;
   }
    /*
   header .hd-ttl .hd-menu ul li.contact a:hover::before {
    background: url("../images/icon_mail_or.png") no-repeat center center;
    background-size: contain;
   }
    */
    
}


/*--------------------------------*/
/* ナビ */

header .gnavi #sp_gnavi-toggle{
    display: none;
    }
    
   header .gnavi{
       padding:0 0;
       background-color:#000000;
       border-bottom:#fe5a00 solid 4px;
    position: relative;
   }
   
   header .gnavi ul{
       width:1000px;
       margin:0 auto;
       border-left:#a5a5a5 solid 1px;
   
   }
   
   header .gnavi ul::after{
       content:"";
       display:block;
       clear:both;
   }
   
   header .gnavi ul li{
       float:left;
       padding:0 0;
       border-right:#a5a5a5 solid 1px;
       width:25%;
       /*height:60px;*/
    height:50px;
   }
   
   header .gnavi ul li.tgl > span,
   header .gnavi ul li > a{
       display: flex;
       justify-content:center;
       align-items: center;
       color:#FFFFFF;
    /*
       font-size:18px;
       line-height:1.6;
    */
       font-size:16px;
       line-height:1.1;
       background-color:#000;
    cursor: pointer;
   
       width:100%;
       height:100%;
       padding:0.5em;
       box-sizing:border-box;
       
       -webkit-transition: background 0.2s ease;
       -moz-transition: background 0.2s ease;
       -o-transition: background 0.2s ease;
       transition: background 0.2s ease;
       
   }
   
   header .gnavi ul li > a:hover{
       text-decoration:none;
       background-color:#ff7e0f;
   }
   
    
    
   #trend header .gnavi ul li.trend > span,
   #trend header .gnavi ul li.trend > a,
   #product header .gnavi ul li.attention > span,
   #product header .gnavi ul li.attention > a,
   #casestudy header .gnavi ul li.attention > span,
   #casestudy header .gnavi ul li.attention > a,
   #proposal header .gnavi ul li.attention > span,
   #proposal header .gnavi ul li.attention > a,
   #movie header .gnavi ul li.attention > span,
   #movie header .gnavi ul li.attention > a,
   /*
   #event_info header .gnavi ul li.event_info > span,
   #event_info header .gnavi ul li.event_info > a,
   #maker_release header .gnavi ul li.maker_release > span,
   #maker_release header .gnavi ul li.maker_release > a,
   */
   #event_info header .gnavi ul li.maker_info > span,
   #event_info header .gnavi ul li.maker_info > a,
   #maker_release header .gnavi ul li.maker_info > span,
   #maker_release header .gnavi ul li.maker_info > a,
   #series header .gnavi ul li.series > span,
   #series header .gnavi ul li.series > a{
       text-decoration:none;
       background-color:#fe5a00;
   }
   
   header .gnavi ul li.tgl:hover span{
       text-decoration:none;
       background-color:#ff7e0f !important;
   }
    
   header .gnavi ul li.tgl .menu-sub{
       /*display:none;*/
       background-color:#ff7e0f;
       position:absolute;
       top:50px;
    /*top: 126px;*/
       left:0;
       width:100%;
       height:0;
       /*padding:15px 0;*/
       padding:0;
       opacity:0;
       overflow:hidden;
       
       font-size:16px;
       line-height:1.4;
       
       -webkit-transition: all 0.2s linear;
       -moz-transition: all 0.2s linear;
       -o-transition: all 0.2s linear;
       transition: all 0.2s linear;
       
       /*
       top:60px;
       left:50%;
       transform:translateX(-50%);
       */
       
   }
   
   header .gnavi ul li.tgl:hover .menu-sub{
       display:block;
       opacity:1;
       height:auto;
       padding:15px 0;
   }
   
   header .gnavi ul li.tgl .menu-sub .inner{
       width:1000px;
       margin:0 auto;
   }
   
   header .gnavi ul li.tgl .menu-sub .inner::after{
       content:"";
       display:block;
       clear:both;
   }
   
   header .gnavi ul li.tgl .menu-sub .btn{
       float:left;
       padding:0 0 0 5px;
       /*border-right:#CCCCCC solid 1px;*/
       width:25%;
       /*height:60px;*/
   }
   
   header .gnavi ul li.tgl.maker_info .menu-sub .btn{
       float:right;
   }
    
   
   header .gnavi ul li.tgl .menu-sub p a{
       display: flex;
       justify-content:center;
       align-items: center;
       color:#000000;
       background-color:#FFFFFF;
   
       width:100%;
       height:100%;
       padding:0.6em 0.5em 0.4em;
       box-sizing:border-box;
       
       -webkit-transition: all 0.2s ease;
       -moz-transition: all 0.2s ease;
       -o-transition: all 0.2s ease;
       transition: all 0.2s ease;
       
   }
   
   header .gnavi ul li.tgl  .menu-sub p a:hover{
       text-decoration:none;
       /*background-color:#fe5a00;*/
       /*background-color:rgba(255,255,255, 0.5);*/
       opacity:0.65;
   }



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

/*--------------------------------*/
/* ナビ */

 
header .gnavi{
	padding:0;
	margin:0 0;
	background-color:#000000;
 /*height: 8px;*/
	border-bottom:#fe5a00 solid 4px;
 height: 54px;
 position: relative;
}
 
/*
header .gnavi #sp_gnavi-toggle{
 display: block;
 width: 40px;
 height: 40px;
 background-color: #FFFFFF;
 position: absolute;
 right: 0;
 top: 0;
 }
 */
 
header .gnavi ul{
	width:100%;
	margin:0 auto;
 display: flex;
}

header .gnavi ul li{
	display:block;
	padding:0;
	border-left:#a5a5a5 solid 1px;
 width: 25%;
 text-align: center;
}

header .gnavi ul li:first-child{
	border:none;
}
 
header .gnavi ul li.tgl > span,
header .gnavi ul li > a{
	display: flex;
	justify-content:center;
	align-items: center;
	color:#FFFFFF;
	font-size:0.75rem;
	line-height:1.4;

	width:100%;
	/*height:100%;*/
	padding:0 0.5em;
	box-sizing:border-box;
 height: 50px;
 cursor: pointer;
 background-color:#000;
	
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

header .gnavi ul li a:hover{
	text-decoration:none;
	/*background-color:#ff7e0f;*/
}

header .gnavi ul li.tgl.open > span,
header .gnavi ul li.open > a{
	text-decoration:none;
	background-color:#ff7e0f !important;
}
/*
header .gnavi ul li.close span,
header .gnavi ul li.close a{
	background-color:transparent;
}
*/
 
#trend header .gnavi ul li.trend > span,
#trend header .gnavi ul li.trend > a,
#product header .gnavi ul li.attention > span,
#product header .gnavi ul li.attention > a,
#casestudy header .gnavi ul li.attention > span,
#casestudy header .gnavi ul li.attention > a,
#proposal header .gnavi ul li.attention > span,
#proposal header .gnavi ul li.attention > a,
#movie header .gnavi ul li.attention > span,
#movie header .gnavi ul li.attention > a,
/*
#event_info header .gnavi ul li.event_info > span,
#event_info header .gnavi ul li.event_info > a,
#maker_release header .gnavi ul li.maker_release > span,
#maker_release header .gnavi ul li.maker_release > a
*/
#event_info header .gnavi ul li.maker_info > span,
#event_info header .gnavi ul li.maker_info > a,
#maker_release header .gnavi ul li.maker_info > span,
#maker_release header .gnavi ul li.maker_info > a,
#series header .gnavi ul li.series > span,
#series header .gnavi ul li.series > a{
	text-decoration:none;
	background-color:#fe5a00;
}

.gnavi ul li.tgl .menu-sub{
	/*display:none;*/
	background-color:#ff7e0f;
	width:100%;
	/*padding:10px 10px;*/
	padding:0 10px;
	/*
	opacity:0;
	overflow:hidden;
	*/
 
	position:absolute;
	top:50px;
 /*top:102px;*/
	left:0;
	height:0;
	opacity:0;
	overflow:hidden;
	
	font-size:0.75rem;
	line-height:1.4;
 
 
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

.gnavi ul li.open .menu-sub{
	display:block;
	opacity:1;
	height:auto;
	padding:10px 10px;
}

.gnavi ul li.tgl .menu-sub .inner{
	/*width:1000px;*/
	margin:0 auto;
}

.gnavi ul li.tgl .menu-sub .btn{
	/*
	float:left;
	padding:0 0 0 5px;
	width:25%;
	*/
	margin-top:5px;
}

.gnavi ul li.tgl .menu-sub .btn:first-of-type{
	/*
	float:left;
	padding:0 0 0 5px;
	width:25%;
	*/
	margin-top:0;
 background-color: aqua !important;
}

.gnavi ul li.tgl .menu-sub p a{
	display: flex;
	justify-content:center;
	align-items: center;
	color:#000000;

	background-color:#FFFFFF;

	width:100%;
	height:100%;
	padding:1em 0.5em 0.8em;
	box-sizing:border-box;
}
}

/*--------------------------------*/
/* フッタ */

footer{
	color:#FFFFFF;
}

footer .container {
	/*background:#FF0;*/
	width:1000px;
	margin:0 auto;
	padding:1.5em 0;
	text-align:center;
}
 
/*--------*/
footer .ft-menu {
 background: #000000;
 color: #FFFFFF;
}
 
footer .ft-menu .container {
 padding:1em 0;
}
 
footer .ft-menu ul {
 display: flex;
 justify-content: center;
 position: relative;
}
 
footer .ft-menu ul li {
 display: block;
 margin: 0;
 padding: 0 0.5em;
 font-size: 16px;
 line-height: 1.2;
 position: relative;
}
 
footer .ft-menu ul li::before,
footer .ft-menu ul li:first-of-type::after{
 content: "";
 display: block;
 background: #ffffff;
 height: 1em;
 width: 1px;
 position: absolute;
 right: 0;
 top: 50%;
 transform: translateY(-50%);
}
 
footer .ft-menu ul li:first-of-type::after {
 left: 0;
 right:auto;
}
 
footer .ft-menu ul li a {
 display: block;
 color: #FFFFFF;
 text-decoration: none;
 padding: 0.5em 1em;
 position: relative;
}
 
footer .ft-menu ul li a:hover {
 color: #ff7e0f;
}
 
footer .ft-menu ul li.estimate a::before,
footer .ft-menu ul li.contact a::before {
 content: "";
 display: inline-block;
 position: absolute;
 left: 1em;
 top: 50%;
 transform: translateY(-50%);
}
 
footer .ft-menu ul li.estimate a {
 padding-left: calc(1.5em + 19px);
}
 
footer .ft-menu ul li.estimate a::before {
 background: url("../images/common/icon_estimate_wh.png") no-repeat center center;
 background-size: contain;
 width: 19px;
 height: 24px;
}
 
footer .ft-menu ul li.contact a {
 padding-left: calc(1.5em + 24px);
}
 
footer .ft-menu ul li.contact a::before {
 background: url("../images/common/icon_mail_wh.png") no-repeat center center;
 background-size: contain;
 width: 24px;
 height: 24px;
}
 
/*--------*/
footer .copyright{
	background:#fe5a00;
}
 
footer .copyright address {
	font-size:12px;
	line-height:1.6;
	font-style:normal;
	/*font-family: Verdana,"Droid Sans";*/
	margin:0;
	padding:0;
	text-align:center;
}

@media screen and (max-width:767px) {
    
    /* フッタ */

footer{
	color:#FFFFFF;
}

footer .container {
    width: 100%;
	margin:0 auto;
	padding:1em 0;
	text-align:center;
}
 
/*--------*/
footer .ft-menu {
 background: #000000;
 color: #FFFFFF;
}
 
footer .ft-menu .container  {
 padding:0.5em 0;
}
 
footer .ft-menu ul {
 display: flex;
 justify-content: center;
 flex-wrap: wrap;
 position: relative;
}
 
footer .ft-menu ul li {
 display: block;
 margin: 0;
 padding: 0 0.5em;
 font-size: 0.75rem;
 line-height: 1.2;
 position: relative;
}
 
footer .ft-menu ul li.home {
 display: block;
 margin: 0 100%;
}
 
footer .ft-menu ul li::before,
footer .ft-menu ul li.home::after,
footer .ft-menu ul li.estimate::after{
 content: "";
 display: block;
 background: #ffffff;
 height: 1em;
 width: 1px;
 position: absolute;
 right: 0;
 top: 50%;
 transform: translateY(-50%);
}
 
footer .ft-menu ul li.home::after,
footer .ft-menu ul li.estimate::after{
 left: 0;
 right:auto;
}
 
footer .ft-menu ul li a {
 display: block;
 color: #FFFFFF;
 text-decoration: none;
 padding: 0.5em 0.5em;
 position: relative;
}
 
footer .ft-menu ul li a:hover {
 color: #ff7e0f;
}
 
footer .ft-menu ul li.estimate a::before,
footer .ft-menu ul li.contact a::before {
 content: "";
 display: inline-block;
 position: absolute;
 left: 0.5em;
 top: 50%;
 transform: translateY(-50%);
}
 
footer .ft-menu ul li.estimate a {
 padding-left: calc(1em + 16px);
}
 
footer .ft-menu ul li.estimate a::before {
 background-size: contain;
 width: 16px;
 height: 20px;
}
 
footer .ft-menu ul li.contact a {
 padding-left: calc(1em + 20px);
}
 
footer .ft-menu ul li.contact a::before {
 background-size: contain;
 width: 20px;
 height: 20px;
}
 
/*--------*/
footer .copyright{
	background:#fe5a00;
}
 
footer .copyright address {
	font-size:0.625rem;
	line-height:1.6;
	font-style:normal;
	margin:0;
	padding:0;
	text-align:center;
}

}



.disp-sp {
    display: none;
}

.disp-pc {
    display: block;
}

@media screen and (max-width:767px) {
    .disp-sp {
        display: block;
    }
    
    .disp-pc {
        display: none;
    }
}