/*===========================================================*/
/* 個別 */
/*===========================================================*/

.linkStyle{color: #fff;border-bottom: 1px solid;}
.catch{
    max-width: 1200px;
    width: 70%;
}
h1.height100per{height: 80%;}
#con1 {
    position: relative;
    z-index: 1;
}
.top_con .con_wrap {
    background-image: linear-gradient(to bottom, rgba(35,35,38,0), rgba(35,35,38,0.8));
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 100% 80%;
    box-sizing: border-box;
}
.top_con .con_bg {
    z-index: -1;
}
.dec01,.dec02{
    left: -2%;
    top: -20%;
    transform: translateY(-50%);
    max-width: 470px;
    width: 40%;
}
.dec02{
    top: inherit;
    left: inherit;
        right: 0%;
    bottom: 0%;
    transform: translateY(50%);
    max-width: 390px;
    width: 40%;
}
#cms_5-c .box_txt1::before,.cms_5-c .box_txt1::before{color: #fff;}
#cms_5-c .box_title1,.cms_5-c .box_title1 {
    border-color: rgb(255 255 255);
}
#sp_nav .grid_12{z-index: 1;}
#sp_nav nav::before{
    content: "";
    position: absolute;
    display: block;
    background-color: rgb(0 0 0 / 30%);
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}
.top_con .con_wrap {
    background-image: linear-gradient(to bottom, rgb(35 35 38 / 35%), rgba(35,35,38,0.8));
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 100% 100%;
    box-sizing: border-box;
}


/*--------------------------------------------
 モーダル 
----------------------------------------------*/
.modal_bt{
    cursor: pointer;
    /*border-radius: 10px;*/
    margin-top: 30px;
    margin-bottom: 20px;
   /* margin-left: 20%;*/
    /*border: 1px solid;*/
    color: var(--text);
    background-color: var(--base);
}
.modal_bt:hover{
    /*opacity: 0.7!important;*/
    background-color: var(--color2);
    color: var(--color1);
}
/*.modal_bt::before{
    font-family: "FontAwesome";
    content: '\f0da';
    padding-right: 10px;
}*/

.modal_box{
    top: 0;
    left: 0;
    background-color: #000;
    z-index: 101;
    overflow-y: scroll;
}
.modal_box .close{
    top: -15px;
    right: -15px;
    width: 50px;
    height: 50px;
    cursor: pointer;
}
.modal_bt{position: relative;text-align: center;}
.modal_bt:hover{
	background-color: rgba(255,255,255,0.1)
}
.modal_bt::before,.modal_bt::after{
    position: absolute;
    content: "";
    display: block;
    pointer-events: none;
	width: 100%;
	height: 100%;
	transition: 0.3s
	
}
.modal_bt::before{
	border-top: solid 1px #fff;
	border-right: solid 1px #fff;
	top: -0.5px;
	right: -0.5px;
}
.modal_bt::after{
	border-bottom: solid 1px #fff;
	border-left: solid 1px #fff;
	bottom: -0.5px;
	left: -0.5px;
}
.modal_bt:hover::before,.modal_bt:hover::after{
	width: 0
}
/* タブレット */
@media screen and (max-width: 768px){
    .modal_bt{
        margin: 20px auto;
    }
    .modal_wrap .modal_item{
        padding-top: 130px;
    }
}

/* スマホ */
@media screen and (max-width: 667px){
    .modal_bt{}
    .modal_wrap .modal_item {
    padding-top: 50px;
}
}
/*===========================================================*/
/* コード集 */
/*===========================================================*/




/*===========================================================*/
/* 下層 */
/*===========================================================*/





/*===========================================================*/
/* タブレット */
/*===========================================================*/
@media screen and (max-width: 768px){
.dec01 {
    top: -13%;
}



}



/*===========================================================*/
/* スマホ */
/*===========================================================*/
@media screen and (max-width: 667px){
.catch {
    top: 60%;
    width: 90%;
}
header.height80vh_sp{
    height: 40vh;
}
header .scroll_d{display: none;}
h1 img.width_200-max_sp{max-width: 140px;}
.top_con .con_wrap {
    background-image: linear-gradient(to bottom, rgb(0 0 0 / 40%), rgba(35,35,38,0.8));
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 100% 100%;
    box-sizing: border-box;
}
#con1{
    margin: 0 0 50px 0;
}
#con2{margin-bottom: 50px;}
.dec01 {
    top: -8%;
}
header .menu_stick {
    top: 30px;
}


}


/*===========================================================*/
/* IE */
/*===========================================================*/
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none){



}


/*===========================================================*/
/* Firefox */
/*===========================================================*/
@-moz-document url-prefix(){

}