﻿
/*h2 {
    font-family: "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif" !important;
}*/
#wrap {
font-family: "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important;
}
.txt_color_nomal{color: #3d3d3d;}
.txt_white{color: white;}
.txt_red{color: red;}
.txt_color1{color: #242a3a} /* メインカラー */
.txt_color2{color: #ebf1ff} /* サブカラー */
.txt_color3{color: #b3b3b3} /* アクセントカラー1 */
.txt_color4{color: #f3f3f3} /* アクセントカラー2 */

/* background-color */
.bg_white{background-color: white} /* 白背景 */
.bg_black{background-color: black} /* 黒背景 */
.bg_color1{background-color: #242a3a} /* メインカラー */
.bg_color2{background-color: #ebf1ff} /* サブカラー */
.bg_color3{background-color: #4977bc} /* アクセントカラー1 */
.bg_color4{background-color: #f3f3f3} /* アクセントカラー2 */

/* border-color ※!important */
.border_color1{border-color: #242a3a}
.border_color2{border-color: #ebf1ff}
.border_color3{border-color: #b3b3b3}
.border_color4{border-color: #f3f3f3}


/* hover ---------------------------------------------------------------------------------------------*/
.hvr_txt_color_nomal:hover{color: #3d3d3d;}
.hvr_txt_white:hover{color: white;}
.hvr_txt_red:hover{color: red;}
.hvr_txt_color1:hover{color: #242a3a} /* メインカラー */
.hvr_txt_color2:hover{color: #ebf1ff} /* サブカラー */
.hvr_txt_color3:hover{color: #b3b3b3} /* アクセントカラー1 */
.hvr_txt_color4:hover{color: #f3f3f3} /* アクセントカラー2 */

/* background-color */
.hvr_bg_white:hover{background-color: white} /* 白背景 */
.hvr_bg_black:hover{background-color: black} /* 黒背景 */
.hvr_bg_color1:hover{background-color: #242a3a} /* メインカラー */
.hvr_bg_color2:hover{background-color: #ebf1ff} /* サブカラー */
.hvr_bg_color3:hover{background-color: #b3b3b3} /* アクセントカラー1 */
.hvr_bg_color4:hover{background-color: #f3f3f3} /* アクセントカラー2 */

/* border-color ※!important */
.hvr_border_color1:hover{border-color: #242a3a }
.hvr_border_color2:hover{border-color: #ebf1ff}
.hvr_border_color3:hover{border-color: #b3b3b3}
.hvr_border_color4:hover{border-color: #f3f3f3}

#map {
    display: none;
}
.mail {
color: #242a3a;
/*border: 1px solid #242a3a;
padding: 10px;*/
}
.shadow {
    box-shadow: 5px 5px 10px rgba(0,0,0,0.6);
}

footer::after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,0.4);
    z-index: 1;
}
#contents .contents_txt {
    background-color: rgba(0,0,0,0.2);
}
.page03 .cate_txt1 {
    position: relative;
    border-right: 1px solid #4977bc;
   border-bottom: 1px solid #4977bc;
    padding-right: 25px;
}
.page03 .cate_txt1:before {
    content: '';
    position: absolute;
    bottom: 0px;
    right: 0px;
    border-bottom: 50px solid #4977bc;
    border-left: 100px solid transparent;
}
/*.page05 #cms_6-b .cate_txt1:before {
    display: none;
}*/
#cms_2-c #cate1 .box_wrap {
    position: relative;
    border-left: 1px solid #4977bc;
   border-bottom: 1px solid #4977bc;
}
#cms_2-c #cate1 .box_wrap:before {
   content: '';
    position: absolute;
    bottom: 0px;
    left: 0px;
    border-bottom: 50px solid #4977bc;
    border-right: 100px solid transparent;
}
#cms_1-c .cate_box {
    position: relative;
    border-right: 1px solid #4977bc;
   border-top: 1px solid #4977bc;
   padding-top: 25px;
}
#cms_1-c .cate_box:before {
   content: '';
    position: absolute;
    top: 0px;
    right: 0px;
    border-top: 50px solid #4977bc;
    border-left: 100px solid transparent;
}
#page08 .border_color2 {
      border-color: #242a3a;
}
 #tel_txt .txt_color2 {   
         color: #242a3a;
}

.cms_wrap .border_color3 {
    border-color: #4977bc;
}

.cms_1-c .border_color4 {
    border-color: #4977bc;
}
.date {
    color: #4977bc;
}

#loader {
    background-color: #242a3a;
}
.loader.logo::before, .loader.logo::after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: #242a3a;
    animation-timing-function: ease-out;
    animation-fill-mode: forwards;
}
#page09 .border_color3 {
    border-color: #4977bc;
}
#header .bg_color3{
        background-color: #4977bc;
}
#top_cms {
    position: relative;
}
#top_cms:before {
	content: url("./Dup/img/top_image.png");
	position: absolute;
	top: 0px;
	right: 0px;
}
#top_cms:after {
	content: url("./Dup/img/footer_image.png");
	position: absolute;
	bottom: -10px;
	left: 0px;
}
#top_cms .bg_color1 {
    background-color: #4977bc;
}
footer #copyright {
        background-color: #242a3a;
}
.more .d_inline_b {
	position: relative;
}
.more .d_inline_b:before {
    position: absolute;
    content: "";
    background-image: url(./Dup/img/hannma.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: top left;
    width: 100px;
    height: 100px;
    top: -29px;
    left: -81px;
    animation: pikopiko 1s steps(2, start) infinite;
}
@keyframes pikopiko {
  0% {
    transform: rotate(-30deg);
  }
  to {
    transform: rotate(30deg);
  }
}
#page_title .txt_center {
	position: relative;
}
#page_title .txt_center:before {
    position: absolute;
    content: "";
    background-image: url(./Dup/img/man.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: left;
    width: 130px;
    height: 100px;
    top: 33%;
    left: -113px;
}
#contents h3:before {
    position: absolute;
    content: "";
    background-image: url(./Dup/img/tama.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 120px;
    height: 150px;
    top: -159px;
}
#contents_links .square_box a:after {
    position: absolute;
    content: "";
    background-image: url(./Dup/img/hannma2.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: top left;
    width: 95px;
    height: 100px;
    top: 64px;
    left: 34px;
}
.top_cms_title {
	position: relative;
}
.top_cms_title:before {
    position: absolute;
    content: "";
    background-image: url(./Dup/img/renti.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: top left;
    width: 100px;
    height: 100px;
    top: -40px;
    left: -4px;
}
/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
#cms_1-c .cate_box:before {
    content: '';
    position: absolute;
    top: 0px;
    right: 0px;
    border-top: 30px solid #4977bc;
    border-left: 60px solid transparent;
}
.page03 .cate_txt1:before {
    content: '';
    position: absolute;
    bottom: 0px;
    right: 0px;
    border-bottom: 30px solid #4977bc;
    border-left: 60px solid transparent;
}
#cms_2-c #cate1 .box_wrap:before {
   content: '';
    position: absolute;
    bottom: 0px;
    left: 0px;
    border-bottom: 30px solid #4977bc;
    border-right: 60px solid transparent;
}
#header .bg_color3{
        background-color: #242a3a;
}
#contents_links .square_box a:after {
    width: 66px;
    height: 100px;
    top: 52px;
    left: 34px;
}
}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
.font_16_sp {
    font-size: 14px;
}
.width_150_sp {
    width: 200px;
}
#page_title .font_20_sp {
    font-size: 30px !important;
}
#page_title .txt_center:before {
    position: absolute;
    content: "";
    background-image: url(./Dup/img/man.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: left;
    width: 130px;
    height: 80px;
    top: 34%;
    left: -88px;
}
#contents h3:before {
    width: 76px;
    height: 150px;
    top: -130px;
}
.top_cms_title:before {
    height: 83px;
    top: -30px;
    left: -4px;
}
}
/* ---------- IEのみ ---------- */
@media all and (-ms-high-contrast: none) {
 #page_title .pd_10px, #contents .pd_10px {
     padding: 15px 10px 10px 10px!important;
}
#page10 .pd_5px {
   padding: 10px 5px 5px 5px;
}

}
