﻿@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Text&display=swap');

body, .font_sans-serif{font-family: "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif"}

#page_top span, .more, a[href^="tel:"], #intro .intro_about, #top_cms .cms_box:last-child .cms_title::before{font-family: 'DM Serif Text', "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif";font-weight: normal}

#logo a{padding: 20px 30px}
#header.headtrans #logo a{width: 180px;padding: 20px 30px}

#footer{background-color: #05365b}
footer .footer_nav{background-color: #b79e6c}
footer .foot_contect .contact_bt a:hover{background-color: #af955b}
#page_title h2::before{position: absolute;content: "";width: 150px;height: 45px;left: 0;right: 0;top: -50px;margin: auto;background-image: url(./Dup/img/img1.png);background-size: cover;background-repeat: no-repeat}

#main_img .main_txt_wrap{top: 50%;bottom: auto;left: 50%;transform: translate(-50%, -50%);padding: 30px 50px;text-align: center;width: 400px!important;border: solid 1px #fff}
#main_img .main_txt_wrap::before, #main_img .main_txt_wrap::after{position: absolute;content: "";width: 150px;height: 45px;left: 0;right: 0;top: -60px;margin: auto;background-image: url(./Dup/img/img1.png);background-size: cover;background-repeat: no-repeat}
#main_img .main_txt_wrap::after{top: auto;bottom: -60px;transform: rotate(180deg)}
#main_img .main_txt{position: relative}
#main_img .main_txt::before{position: absolute;content: "";width: 40px;height: 1px;left: 0;right: 0;bottom: -15px;background-color: #fff;margin: auto}

#intro{padding-top: 0}
#intro .intro_wrap{background-image: url(./Dup/img/intro_bg.png);background-size: 1000px;background-position: left 0 bottom 40px;background-repeat: repeat-x;animation: intro 30s linear infinite}
#intro .intro_about{top: 90px;left: -140px;transform: rotate(90deg)}
#intro .intro_about::before{position: absolute;content: "";width: 80px;height: 1px;top: 0;bottom: 0;right: 0;background-color: #333;margin: auto}

#contents2 .con2_title{border-top: solid 1px rgba(255,255,255,0.2);position: relative}
#contents2 .con2_title::before{position: absolute;content: "";width: 40px;height: 1px;top: -1px;left: 0;background-color: #fff}
#contents1 .con1_title{padding-top: 60px;background-image: url(./Dup/img/img1.png);background-size: 150px;background-repeat: no-repeat;background-position: top center}
#top_cms .cms_box:not(:first-child)::before{display: none}
#top_cms .cms_title span, #contents1 .con1_title::before{height: 1px}
#top_cms .cms_box .cms_title{position: relative;z-index: 0}
#top_cms .cms_box .cms_title::before{position: absolute;content: "TOPICS";display: block;width: 100%;left: 0;text-align: center;top: -55px;font-size: 60px;color: #fff;z-index: -1;letter-spacing: 5px;}
/** #top_cms .cms_box:last-child .cms_title::before{display: none} **/
.cms_2-b .cate{cursor: pointer}
.cms_2-b .cate:nth-child(1) a{color: #2e58bf}
.cms_2-b .cate:nth-child(2) a{color: #673da3}
.cms_2-b .cate:nth-child(3) a{color: #cca352}
.cms_2-b .cate:nth-child(4) a{color: #37b3dd}
.cms_2-b .cate:nth-child(5) a{color: #d63e3e}
.cms_2-b .cate:nth-child(6) a{color: #52912a}
.cms_2-b .cate:nth-child(7) a{color: #d8558a}
.cms_2-b .cate:nth-child(8) a{color: #a2c640}
.more a{z-index: 0}

.cate_title{background-color: transparent;padding: 0;margin: 0;display: block;border: none;width: 100%!important;font-size: 24px;text-align: center;padding-bottom: 40px;margin-bottom: 50px;color: #af955b;font-weight: normal;position: relative}
.cate_title::before, .cate_title::after{position: absolute;content: "";left: 0;right: 0;margin: auto}
.cate_title::before{width: 200px;height: 1px;bottom: 0;background-color: #e6e6e6}
.cate_title::after{width: 1px;height: 40px;bottom: -20px;background-color: #af955b}

#pc_nav .nav_sub{top: calc(100% - 1px);left: 50%;transform: translateX(-50%);width: 250px}
#pc_nav .nav_sub li:not(:last-child){border-bottom: solid 1px #f2f2f2}
#pc_nav .nav_sub li:nth-child(1) a{color: #2e58bf}
#pc_nav .nav_sub li:nth-child(2) a{color: #673da3}
#pc_nav .nav_sub li:nth-child(3) a{color: #cca352}
#pc_nav .nav_sub li:nth-child(4) a{color: #37b3dd}
#pc_nav .nav_sub li:nth-child(5) a{color: #d63e3e}
#pc_nav .nav_sub li:nth-child(6) a{color: #52912a}
#pc_nav .nav_sub li:nth-child(7) a{color: #d8558a}
#pc_nav .nav_sub li:nth-child(8) a{color: #a2c640}


/** tablet 780 **/
@media screen and (max-width: 768px){
#logo a{width: 150px;padding: 10px 0}
#logo a img{width: 100%!important}
#loader img{width: 200px!important}
#intro .intro_about{top: 0;left: 0;transform: none}
#contents1 .more a, #contents2 .more a{color: #af955b}
#intro .intro_wrap{background-position: left 0 top 40px;animation: intro2 30s linear infinite}
}

/** mobile 750 **/
@media screen and (max-width: 667px){
#logo a{width: 100px}
#main_img .main_txt_wrap{padding: 20px 0;width: 200px!important}
#top_cms .cms_box:last-child .cms_title::before{font-size: 55px}
}

/** IE **/
@media all and (-ms-high-contrast:none) {
#intro .more .hvr_more_span, #contents1 .more .hvr_more_span, #contents2 .more .hvr_more_span, .cms_wrap .more .hvr_more_span{padding-top: 20px}
#footer .tel_bt a{padding-top: 12px;padding-bottom: 12px}
}

@keyframes intro{
0% {background-position: left 0 bottom 40px}
100% {background-position: left -1000px bottom 40px}
}
@keyframes intro2{
0% {background-position: left 0 top 40px}
100% {background-position: left -1000px top 40px}
}