﻿@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Sawarabi+Mincho&display=swap');
.head_box {
      scrollbar-width: none;
}
.matrix:first-letter {
    color: #daa520;
    font-size: 30px;
}
.matrix .bg-wrap,
.matrix .bg-wrap .inn, .matrix2 .bg-wrap,
.matrix2 .bg-wrap .inn {
  display: block;
}
.matrix .bg-wrap, .matrix2 .bg-wrap {
  overflow: hidden;
  opacity: 0;
}
.matrix .bg-wrap .inn, .matrix2 .bg-wrap .inn {
  opacity: 0;
  transform: matrix(1, 0, 0, 1, 0, 100);
  transition: 1.9s cubic-bezier(0.22, 1, 0.36, 1);
}
.matrix.is-animated .bg-wrap, .matrix2.is-animated .bg-wrap {
  opacity: 1;
}
.matrix.is-animated .bg-wrap .inn, .matrix2.is-animated .bg-wrap .inn {
  opacity: 1;
  transform: matrix(1, 0, 0, 1, 0, 0);
}
.matrix2.is-animated .bg-wrap .inn {
     transition-delay: 0.5s;/*開始までの時間*/
    
     animation-duration: 1.5s;/*変化時間*/
}
.more a:hover {
    transform: scale(1.05,1.05);
}



.top_cmsWrap:after {
    content: "";
    width: 167%;
    display: block;
    height: 48%;
    position: absolute;
    /* top: 10%; */
    top: 25%;
    left: -37%;
    right: 0;
    z-index: -2;
    margin: auto;
 background-color: #e0e3e6;
    background-image: url(Dup/img/notebook.png);   
    transform: rotate( 10deg);
}
#contents_box, .top_cmsWrap {
    position: relative;
}
#contents_box:after {
content: "";
    width: 167%;
    display: block;
    height: 88%;
    position: absolute;
    top: 2%;
    left: -37%;
    right: 0;
    z-index: -1;
    margin: auto;
    transform: rotate(
344deg
);
 background-color: #e0e3e6;
    background-image: url(Dup/img/notebook.png);
}

#logo {
    padding-left: 0;padding-right: 0;
}
/* -----------fontsize--------------- */
body {
	font-size: 15px;
	line-height: 1.7;font-family: 'Sawarabi Mincho', sans-serif;
}
h1, h2, h3, h4, .font_en {
   font-family: 'Sawarabi Mincho', sans-serif; 
}
.font_14 {
	font-size: 15px;
}
.fadein{
     opacity: 0;
    /*transform: translateY(20px);*/
     transition: 2.5s;
     transition-property: opacity,transform;
    filter: blur(2px);
}
.fadein.fadetrans{
     opacity: 1;
     transform: none;
    filter: blur(0);
    animation-name: blur;
    /*animation-duration: .5s;*/
}
.fadein2{
     opacity: 0;
     transition: 1.5s;
     transition-property: opacity,transform
}
.fadein2.fadetrans{
     opacity: 1;
    transform: none;
}
.catch {
    position: absolute;
   top: 44%;
    left: 0;
    right: 0;
    margin: auto;
    width: 100%;
    z-index: 10;
}
.catch2 {position: relative;
}
.catch2::before {
    position: absolute;
    content: "";
    width: 40px;
    height: 2px;
    left: 0;
    right: 0;
    top: -10px;
    margin: auto;
    background-color: #fff;
}
.demoTxt {
  display: block;
opacity:0;
 font-size: 36px;
 font-weight: bold;
 text-align: center;

}
.demoTxt span {
 opacity: 0;
-webkit-transition: .6s ease-in-out;
 transition: .2s ease-in-out;/*←数字大きくするとなめらかになる*/
}
main {
    overflow: hidden;
}

#main_menu ul li a {
    font-size: 20px;font-family: 'Libre Baskerville', serif;
}
#main_menu ul li a:hover {
     color:  #DAA520;
}
.contact_bt a, .tel_bt a {
    font-size: 20px;
    font-family: 'Libre Baskerville', serif;
}
.button:hover::after {
    box-shadow: inset 0 0 0 15em rgba(218, 165, 32,1);
}
.button2 {
    color: #2c2c2c;    position: relative;
    overflow: hidden;
}
.button2:hover {
    box-shadow: none;
color: #fff;
}
.button2::after {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: -1;
    display: block;
    content: '';
    width: 30em;
    height: 30em;
    border-radius: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    transition: all .5s;
}
.button2:hover::after {
    box-shadow: inset 0 0 0 15em rgba(218, 165, 32, 1);
}


#page_title .txt_shadow-b {
	text-shadow: none;
}
#page_title h2, #page_title p {
	color: #daa520;
	z-index: 10;
	position: relative;
}
#page_title p {
	letter-spacing: 0.1rem;
	color: #02010c;
}
#main_menu ul li a::before {
    background-color: #ffffff;
}
#main_menu ul li a:hover::before {
   background-color: #daa520;
}
/*-------------ページタイトルの左横線--------------*/
#page_title .page_box::before {
    background-color: #02010c;
}

/*-----------------------hamburger-------------------------*/
.hamburger__icon.bg_color1, .hamburger__icon:after, .hamburger__icon:before {
    background-color: #fff!important;
}
.hamburger.active .hamburger__icon {
    background-color: transparent!important;
}

.fat-nav {
   background-color: inherit!important;
}
.fat-nav .bg_white {
  background-color: #02010c!important;
}
.fat-nav ul.bg_white li a{
	color: #fff;
}
.fat-nav li {
   font-size: 16px;
}
.main_box .button:after {
    background: #daa520;
    transition-delay: 1s;
}
.cms_title h2 {
    font-size: 34px;
}
.cms_title::before {
    background-color: #daa520;
}
/* --------------------------footerの重なり等--------------------------- */
.footerWrap {
    background-color: #ced1d3;
background-image: url(Dup/img/office.png);
}
.foot_tel_bt {
    position: relative;z-index: 0;
}
#page-top i, #page-top span, #footer_menu li a, #copyright, #copyright a {
    color: #fff;
}
/*----------SNSリンク中央寄せ------------*/
.link_box ul {
	justify-content: center;
}
.link_box ul li {
    width: 30px!important;
    margin-left: 10px;
    margin-right: 10px;
}
@media(min-width: 668px) {
   /* .cms_1-a .cate_box:nth-child(2) {
    margin-top: -60px;
}

.cms_1-a .cate_box:nth-child(3) {
    margin-top: -117px;
}*/

}
@media screen and (max-width: 768px) {
    header #logo {
        max-width: 249px;
    }
    #contents_box:after {
    width: 199%;
    height: 71%;
    top: 6%;
    left: -47%;
}
.catch {
    top: 33%;
}
}
@media screen and (max-width: 667px) {
    header #logo {
    max-width: 184px;
}
.catch {
    top: 26%;
    width: 92%;
}
.demoTxt {
    font-size: 22px;
}
.cms_title h2 {
    font-size: 27px;
}
#contents_box:after {
    width: 320%;
    height: 61%;
    left: -103%;
    top: 3%;
}
.top_cmsWrap:after {
    width: 225%;
    height: 38%;
    top: 25%;
    left: -65%;
}
}

@media all and (-ms-high-contrast: none) {
	.cate_list li a {/*各ページのカテゴリリスト*/
		padding: 10px 0 8px;
	}
	.cate_wrap h3 {
		padding: 0 5px 18px 12px;
	}
	#cms_6-a .cate .cate_title {
	    padding-top: 21px!important;
	}
	#page10 ul li a {/*sitemap 要らん時もある*/
		padding: 15px 0 12px;
	}
	#main_menu ul li a::before {/*左メニューの横線*/
		top: 43%;
	}
	.pc_box .contact_bt a {/*ヘッダーのお問い合わせ・電話番号のところが下にズレているとの指摘　要らん時もある*/
		padding:  17px 0 15px;
	}
	.head_box {/*ロゴ部分がスクロールする問題*/
		-ms-overflow-style :none;
	}
	.pager li a {
		padding: 4px 0 3px;
	}
	#page8 #contact_tel a {
		padding: 30px 10px 27px;
	}
	#page9 .box p a{
	    padding: 8px 5px 5px;
	}
}