/*-------ani start-------*/

.fadein{
     opacity: 0;
     transform: translateY(10px);
     transition: 0.2s;
     transition-property: opacity,transform;
}

.fadein.fadetrans{
     opacity: 1;
     transform: none;
     -webkit-animation: bound 1s ease-in forwards;
    -moz-animation: bound 1s ease-in forwards;
    animation: bound 1s ease-in forwards;
}

@keyframes bound {
  /** 開始時は１倍の大きさ */
  from { transform: scale(1.5); }
  /** 0%～25%にかけて1.15倍する */
  25% { transform: scale(1.65); }
  /** 25%～50%にかけて0.95倍する */
  50% { transform: scale(0.95); }
  /** 50%～75%にかけて1.05倍する */
  75% { transform: scale(1.05); }
  /** 終了時は元の大きさに戻す */
  to { transform: scale(1); }
}

.fadein2{
     opacity: 0;
     transform: translateY(50px);
     transition: 0.7s;
     transition-property: opacity,transform;
}

.fadein2.fadetrans2{
     opacity: 1;
     transform: none
}




/*-------ani end-------*/

/*------global start------*/

.linkStyle{
    color:#a40000;
}

#logo{
    padding-top: 20px;
}

.logo {
    width: 270px;
}

.txt_color1 {
    color: #a40000;
}

body, .txt_color_nomal {
    color: #000;
}

.bg_color1 {
    background-color: #a40000;
}

#fakeloader{
    background-color: #f7e9cf !important;
}

#fakeloader .fl{
	position: absolute!important;
	top: 50%!important;
	left: 50%!important;
	transform: translate(-50%,-20%);
	width: 50%!important;
	max-width: 300px!important;
	animation: load 0.2s linear forwards;
	opacity: 0;
}

@keyframes load {
  100% { 
      opacity:1;
      transform: translate(-50%,-50%);
  }
}


.svg_box, .svg_box2{
    display:none !important;
}

h2, h3{
    font-weight:bold;
}

#top_cms h2{
    color: #a40000;
    background-color: #f5f5f5;
    padding: 10px 20px;
        /*border-bottom: 2px solid #e0dede;*/
    font-size: 24px;
        border-left: 3px solid #a40000;
        background-size: contain;
}


.drawer-hamburger-icon.bg_color1{
background-color:#a40000 !important;
background-image:none;
}

.drawer-hamburger-icon:after, .drawer-hamburger-icon:before {
    background-color: rgb(164, 0, 0) !important;
}

.drawer-open .drawer-hamburger-icon {
    background-color: transparent !important;
}


.cate_list li{
        background-image: url(./Dup/img/list.png);
    background-size: 100% 100%;
}

/*------global end------*/

footer .bg-mask{
    background: #f7f7f7 !important;
}


/*---------top start------------*/

header #header #header_menu li a span {
    color: black;
}

header #header #header_menu li a:hover span {
    color: #a40000;
}

#main_img:before{
    content: "";
    display: block;
    width: 90%;
    height: 90%;
    position: absolute;
    top: 50%;
    left: 50%;
    background-image: url(./Dup/img/font.png);
    background-position: center right;
    background-repeat: no-repeat;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%);
    background-size: contain;
    pointer-events: none;
}

/*--------------top end---------------*/

/*-------footer start-------*/

.info_txt .txt_color1{
    color: black;
}

/*-------footer end-------*/

/*------top start------*/

#main_img {
    max-height: 100%;
    overflow: visible;
}

/*#contents .box:nth-of-type(1){
    position:relative;
    background-color:black;
}

#contents .box:nth-of-type(1):before{
    position:relative;
}*/

#contents{
    background-image: url(./Dup/img/hanko.png);
    background-repeat: no-repeat;
    background-position: bottom right;
    background-size: 30%;
}

#contents h3{
    background-color: #a40000;
    padding: 10px 20px;
    color: white;
    font-weight: bold;
    position: relative;
    transform: rotate(-1deg);
}

#contents h3:before{
    content: "";
    display: block;
    width: 100%;
    height: 60px;
    position: absolute;
    top: 80%;
    left: 93%;
    background-image: url(./Dup/img/buta.png);
    background-position: center;
    background-repeat: no-repeat;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%);
    background-size: contain;
    pointer-events: none;
}

#contents h3:after{
    content: "";
    display: block;
    width: 0px;
    height: 0px;
    position: absolute;
    bottom: -50px;
    left: 5px;
    z-index: -1;
    border-left: 0px solid #a40000;
    pointer-events: none;
    border-top: 30px solid #a40000;
    border-bottom: 30px solid transparent;
    border-right: 30px solid transparent;
}



#intro_txt h2 span{
    font-size: 25px;
    font-weight: bold;
}

.catch{
        display: block;
    max-width: 240px;
    margin: auto;
        margin-top: -50px;
}

#intro_txt{
    background-image: url(./Dup/img/hasi.png), url(./Dup/img/come.png);
    background-repeat: no-repeat;
    background-position: bottom left, 95% 5%;
    background-size: 28%, 13%;
}

#top_cms .cms_2-c .box_description2{
    padding-left: 30px;
    border-color: #e8e7e7;
}

#top_cms .cms_1-c{
        padding: 50px 0;
}

#top_cms {
    margin-bottom: 0;
    padding-bottom: 150px;
    background-image: url(./Dup/img/foot.png);
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: contain;
}


/*-------top end--------*/

/*--------page03 start--------*/

#cms_2-c .cate_txt1{
        font-size: 23px;
    font-weight: bold;
    line-height: 1.9em;
    color: #a40000;
    letter-spacing: 0.05em;
    padding: 20px;
    /*background-image: url(./Dup/img/cate_back.png);*/
    background-position: bottom right;
    background-size: 17%;
    background-repeat: no-repeat;
}



/*--------page03 end--------*/


@media all and (-ms-high-contrast: none){
  #contents h3 {
   padding-bottom: 4px;
}

#top_cms h2 {
    padding-bottom: 4px;
}


}

@media screen and (max-width: 1000px){
header .logo {
    width: 220px;
}

}

@media screen and (max-width: 850px){
    #cms_2-c .cate_txt1 {
    background-image: none;
}
}




/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){

header #header #header_menu li {
    width: auto;
}

header #logo{
    margin-bottom: 0;
}

#main_img{
    margin-top: 113px;
}

.catch {
    max-width: 180px;
}

#top_cms {
    padding-bottom: 10px;
    background-size: contain;
}

#cms_2-c .cate_txt1 {
    font-size: 18px;
}

header .logo{
    width: 230px;
}

}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){

#top_cms .cms_2-c .box_item.box_bescription2{
    padding-left: 20px;
}

#main_img {
    margin-top: 70px;
}

.catch {
    max-width: 120px;
}

#cms_2-c .cate_txt1 {
    font-size: 16px;
}

#logo {
    padding-top: 10px;
}

#intro_txt {
    background-position: bottom left, 95% 0%;
    background-size: 28%, 18%;
}

#contents h3 {
    margin-bottom: 30px;
}

#cms_2-c .cate_txt1{
    letter-spacing: 0em;
    font-size: 15px;
}


}