﻿/*===========================================================*/
/* 個別 */
/*===========================================================*/
@import url('https://fonts.googleapis.com/css2?family=Anton&display=swap');
#aisatu .aisatu_title h2,.num,#contents_links .square_box a p,#top_cms .top_cms_title p span{font-family: 'Anton', sans-serif;}
.sample{
    bottom: 120px;
    right: 50px;
    color: #fff;
    z-index: 5;
    font-size: 3rem;
    text-shadow: 3px 3px 5px black;
}
#main_img::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.1);
    z-index: 1;
}
#main_img .slick{position: relative;overflow: hidden;}
#main_img #catch{width: 40%;left: 0;top: 40%;}
#main_img #catch h2{left: 0;border: none;top: 0;}
#main_img #catch h2 span,#sub_menu,footer #copyright{background-color: #000;}
#aisatu,#contents_links{
    background-image: linear-gradient(to right, rgba(255,255,255,0.1) 50%, transparent 50%);
    background-size: 0.3%;
}
#wrap{background-color: #f8faff;}
#intro .box_wrap .box > div span{border-color: #b8860b transparent transparent transparent!important;}
#intro .box_wrap .box {
    width: 50%;
    box-sizing: border-box;
}
#intro .box_wrap .box > div{width: 100%;margin-left: 0;}
#contents_links{background-color: #dbdbdb;}
#contents .contents_txt h3{min-width: 100%;}
#contents .contents_txt > div{padding: 0;}
#top_cms .top_cms_title h3{
    color: #fff;
    border-color: #141414;
    background-color: #000;
    padding-top: 20px;
}
#top_cms .top_cms_title p span{font-size: 20px;background-color: #b8860b;}
#top_cms .top_cms_box .more a{background-color: #000;}
header #header #main_menu li:last-of-type a span,#sc_menu ul li:last-of-type a span{display: none;}
footer::after{background-color: rgba(0,0,0,0.3);}
.dec{
    z-index: 1;
    bottom: 100px;
    left: -200px;
    opacity: 0.1;
    max-width: 1000px;
}
.num{color: #b8860b;font-size: 20px;}
.num,#contents_links .square_box a p,#top_cms .top_cms_title p span{text-transform: uppercase;}
#cms_5-b .cate_box .open_bt .box_title1, .cms_5-b .cate_box .open_bt .box_title1{font-weight: 600;}
header #header{z-index: 2;}
/*===========================================================*/
/* animation */
/*===========================================================*/
#main_img #catch{transform: translateY(0);transition: 0.5s;opacity: 0;}
#main_img #catch.aaa{transform: translateY(-50%);opacity: 1;}
.fadeInTrigger{opacity: 0;transform: translateY(100px);transition: 0.5s;}
.fadeInTrigger.fadeIn{opacity: 1;transform: translateY(0);}
#contents_links .square_box.fadeInTrigger{opacity: 0;transform: translateY(0);transition: 0.5s;}
#contents_links .square_box.fadeInTrigger.fadeIn{opacity: 1;transform: translateY(-50%);}
.delay-time02{
  animation-delay: 0.2s;
}
.delay-time04{
  animation-delay: 0.4s;
}
@keyframes flipInY{
    0% {
    -webkit-transform: perspective(400px) rotateY(
90deg);
    transform: perspective(400px) rotateY(
90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
}
40% {
    -webkit-transform: perspective(400px) rotateY(
-20deg);
    transform: perspective(400px) rotateY(
-20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
}
60% {
    -webkit-transform: perspective(400px) rotateY(
10deg);
    transform: perspective(400px) rotateY(
10deg);
    
}
80% {
    -webkit-transform: perspective(400px) rotateY(
-5deg);
    transform: perspective(400px) rotateY(
-5deg);
}
100% {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    opacity: 0.1;
}
}
/*===========================================================*/
/* 下層 */
/*===========================================================*/
#cms .cate_title{font-weight: 600;}
.cate_list li a{color: #2b2b2b;}
#page_title::after{background-color: rgba(0,0,0,0.3);}
#page10 li a span.title{color: #2b2b2b;}

/*===========================================================*/
/* タブレット */
/*===========================================================*/
@media screen and (max-width: 768px){
#main_img .slick{
        width: 100% !important;
        height: auto!important;
}
#main_img #catch {
    width: 100%;
}
#main_nav li a span{color: #2b2b2b;}
#aisatu .aisatu_title h2{opacity: 1;transform: none;}
.dec {
    z-index: 3;
    bottom: 280px;
    left: -100px;
    opacity: 0;
    width: 60%;
}
#cms_1-a .pager li,.pager li{margin: 0;}



}



/*===========================================================*/
/* スマホ */
/*===========================================================*/
@media screen and (max-width: 667px){
    #main_img #catch{transform: translateY(50%);}
#main_img #catch.aaa{transform: translateY(0);}
.dec {
    bottom: 220px;
    left: -40px;
}
h1 {
    width: 60%;
}
#page07 .box h3{padding-right: 5px;}


}


/*===========================================================*/
/* IE */
/*===========================================================*/
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none){
    #page-top{width: 50px;height: 50px!important;}
#page-top .fas{left: 55%!important;}
#cms_2-b .cate .cate_title,#cms_3-b .cate_title,#cms_6-a .cate .cate_title{padding-top: 10px!important;}

}


/*===========================================================*/
/* Firefox */
/*===========================================================*/
@-moz-document url-prefix(){

}