@import url('https://fonts.googleapis.com/css2?family=Corinthia:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Secular+One&display=swap');

.en,
.Russo,
#top_contents1 h3::before,
#top_contents2 h3::before{
    /*font-family: 'Corinthia', cursive;*/
    font-family: 'Secular One', sans-serif;
}
.font1{
    font-family: 'Secular One', sans-serif;
}

.linkStyle{
    color:#e60011;
}
.linkStyle:hover{
    transition:all 0.3s;
    opacity:0.7;
    text-decoration:underline;
}

.sample_txt{
    left: 26%;
    bottom: 39%;
    color: #fff;
    z-index: 1;
    font-size: 2rem;
    line-height: 1.3;
    display:none;
}



/*--all page---------------------------
-------------------------------------*/
body{
    font-family: "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    background-color: #d7d7d7;
}
#pc_nav li span.en,
#pc_nav li span.jp{
    color:#222;
}
#header{
    background-color:rgba(255,255,255,0.5);
}
#header_contact{
    font-size:1.5rem;
}
#header_contact a.btn_back{
    background-color: #e60011;
    height: 91px;
}
#header_contact span{
    color:#fff;
    top: 23px;
}
#header_contact a.btn_back:hover{
    background-color:#222;
}
#pc_nav li span.en{
    font-size: 1.2rem;
    line-height: 1.3;
}
#top_cms .c-btn__txt{
    font-size:1.2rem;
}
footer{
    background-color:#222!important;
}
#footer_contact .Russo{
    color:white;
}
.footer_info {
    margin: 0 auto;
}
#logo2{
    width:250px;
}
#page-top .Russo{
    font-family: "Noto Sans JP","Hiragino Kaku Gothic ProN", "游ゴシック体", YuGothic, "YuGothic M", meiryo, sans-serif;
}

/*--top page---------------------------
-------------------------------------*/
#vegas{
    overflow:hidden;
    height:99vh;
}
.catch{
    left:5%;
    bottom:50%;
    font-size:3rem;
    color:white;
    z-index: 1;
}
header span.before{
    width: 230px;
    bottom: auto;
    top: 0;
}
header span.after{
    width: 230px;
    top: auto;
    bottom: 0;
}
#top_message{
        box-shadow: 0px 0px 135px #bdbdbd;
}
#top_message h2{
    font-weight:bold;
}
#top_message p:first-of-type{
    font-size:6rem;
}
.item1{
    width: 5vw;
    top: 28%;
    left: 10%;
}
.item2{
    width: 3.5vw;
    top: 25%;
    right: 12%;
}
.item3{
    width: 3.7vw;
    bottom: -26%;
    left: 21%;
}
.item4{
    width: 2.5vw;
    bottom: -15%;
    right: 23%;
}
.item5{
    width: 6.5vw;
    bottom: -15%;
    left: 2%;
}
.item6{
    width: 5vw;
    bottom: 5%;
    right: 2%;
}
.en1{
    bottom: -180%;
    left: 10%;
}
#top_contents1 h3::before,
#top_contents2 h3::before{
    color:rgba(255,255,255,0.7);
}
#top_contents1 div span.after,
#top_contents2 div span.after{
    background-color: #2a2a2a;
}

.top_cms_sec{
    border-bottom:2px solid #333;
}
.cms_title p{
    font-size: 4rem;
    position: absolute;
    top: -60px;
    left: -30px;
    color: white;
    z-index: -1;
}

/*top animation*/
/*swing*/
.swing1{
    animation: swing 1s steps(2, start) infinite;
    z-index: 2;
}
@keyframes swing{
    0%{
        transform:rotate(10deg);
    }
    100%{
        transform:rotate(-10deg);
    }
}

.swing2{
    animation: swing2 1s steps(2, start) infinite;
    z-index: 2;
}
@keyframes swing2{
    0%{
        transform:rotate(-10deg);
    }
    100%{
        transform:rotate(10deg);
    }
}

/*右回転*/
.rotate {
  display: inline-block;
  animation: r1 80s linear infinite;
}
 
@keyframes r1 {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(360deg); } 
}

/*下からフェードイン*/
 .fadein {
  opacity: 0;
  transform : translate(0, 50px);
  transition : all 1500ms;
}
.fadein.scrollin{
  opacity: 1;
  transform: translate(0, 0);
}

/*--under page---------------------------
-------------------------------------*/
#filter_white{
    background-color: rgba(70, 70, 60, 0.35);
}
#page_title h2{
    color:white;
}
#page_title p{
    font-size:2rem;
    color:white;
}


#cms_2-c .cate_title {
  position: relative;
  border-bottom: 2px solid #999;
}

#cms_2-c .cate_title:before {
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 20%;
  height: 2px;
  content: '';
  background: #222;
}
#page9{
    letter-spacing:1px;
}


/* ---------- responshive ---------- */
@media screen and (max-width: 1660px){
header span.before,
header span.after{
    display:none;
}
}

@media screen and (max-width: 1380px){
.item1{
    left: 6%;
 }
.item2{
    right: 7%;
 }
}

@media screen and (max-width: 1190px){
.item1{
    left: 2%;
 }
.item2{
    right: 2%;
 }
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
#vegas{
    height: 42vh;
    margin-bottom: 150px;
}
.sample_txt{
    display:none;
}
.catch{
    font-size:2rem;
}
 .fadein {
  opacity: 1;
 }
  #top_message{
      margin-bottom:200px;
  }
 #top_message p:first-of-type {
    font-size: 5rem;
}
.item1 {
    width: 8vw;
    top: -12%;
    left: 8%;
}
.item2 {
    width: 5.5vw;
    top: -13%;
    right: 6%;
}
.item3 {
    width: 6.1vw;
    bottom: -15%;
    left: 34%;
}
.item4 {
    width: 4.22vw;
    bottom: -16%;
    right: 34%;
}
.item5 {
    width: 10.5vw;
    bottom: -14%;
    left: 5%;
}
.item6 {
    width: 8vw;
    bottom: -16%;
    right: 8%;
}
.en1 {
    bottom: -37%;
    left: 0%;
}
.top_contents1_box, 
.top_contents2_box{
    padding-top:50px;
}
#top_contents1 h3,
#top_contents2 h3{
    text-align:center;
    font-weight:bold;
    margin-bottom:20px;
}
#top_contents1 h3::before,
#top_contents2 h3::before{
    color: rgba(66,66,66,0.7);
    top: -135%;
}
#footer_contact{
    position:relative;
}
#footer_contact::before{
    content:'';
    position:absolute;
    display:block;
    width:100%;
    height:100%;
    background-color:rgba(0,0,0,0.3);
    top:0;
    left:0;
    z-index:1;
    pointer-events:none;
}
#footer_contact h3,
#footer_contact p,
#footer_contact .d_flex{
    position:relative;
    z-index:2;
}
#page_title p {
    font-size: 1.2rem;
}
}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
#logo {
    width: 80px;
}
#header{
    padding:7px 0;
}
.l-header__toggle {
    top: 10px;
}
#vegas {
    height: 31vh;
    /*margin-top: 65px;*/
    margin-bottom:50px;
    position:relative;
}
#vegas::before{
    content:'';
    position:absolute;
    display:block;
    width:100%;
    height:100%;
    top:0;
    left:0;
    background-color:rgba(0,0,0,0.3);
    z-index:1;
}
#header{
    border-bottom:0;
}
.catch{
    font-size:1.2rem;
    bottom:5%;
    z-index:2;
}
#top_message p:first-of-type {
    font-size: 3rem;
}
#top_message h2 {
    font-size: 20px;
    letter-spacing: 0.2em;
    text-align:center;
}
.item1,
.item5{
    display:none;
}
.item2 {
    width: 7.5vw;
    top: auto;
    right: auto;
    bottom: -14%;
    left: 8%;
}
.item3 {
    width: 7.5vw;
    bottom: -12%;
    left: 34%;
}
.item4 {
    width: 5.2vw;
    bottom: -14%;
    right: 34%;
}
.item6 {
    width: 10vw;
    bottom: -13%;
    right: 8%;
}
.en1 {
    bottom: -17%;
}
.cms_title p{
    left:-20px;
}

}

/* ---------- IEの処理 ---------- */
@media all and (-ms-high-contrast: none){
#contact_tel a{
    padding-top:35px;
}
.pager li a{
    padding-top:15px;
}
.cate_list li a{
    padding:20px 20px 15px;
}
 #cms_6-b .cate_box .box_txt1, #cms_6-b .cate_box .box_txt2{
    padding-top:15px;
}
#page7 .info_wrap > div{
    padding-top:25px;
}
#page9 .mg_l-30px a{
    padding-top:10px;
}
}