@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed&display=swap');
body{font-family: 'Noto Sans JP', "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}
.font1{
  font-family: 'Roboto Condensed', sans-serif;
  font-size:3rem;
  letter-spacing:3px;
}

/*----------------all page--------------------------*/
/*loading*/
#fakeloader .fl {
    position: absolute!important;
    top: 50%!important;
    left: 50%!important;
    transform: translate(-50%,-50%)!important;
    width: 50%!important;
    max-width: 250px;
}
#fakeloader .fl{
	animation-name: loader;
	animation-duration: 5s;
	animation-timing-function: ease;
	animation-iteration-count: infinite;
}
@keyframes loader {
	0% {opacity: 0;}
	50% {opacity: 1;}
	100% {opacity: 0;}
}
#header #logo{padding-top:20px;}
header{ 
  padding-bottom:20px;
  background: rgba(255,255,255,0.8)!important;
}
/*header_menu*/
#header_menu li {
     height: 1.5em;
    text-align: center;
     font-size: 18px;
     letter-spacing: 2px;
}     
#header_menu li span{
      transition: 0.3s;

}
#header_menu li span:nth-child(1) {display: block;}
#header_menu li span:nth-child(2) {
     opacity:0;
     position: relative;
     top: -1.5em;
}
#header_menu li:hover span:nth-child(1) {opacity: 0;}
#header_menu li:hover span:nth-child(2) {opacity: 1;}
header #header #header_menu li:last-child a span:nth-child(2){top:-39px;}
header #header #header_menu li a span{padding-top:0;}
#logo .logo img{width:100%!important;}

.svg_box,.svg_box2{display:none!important;}
.linkStyle{color:#3c88b5;}
#logo2{width:300px;}


/*-------------------top page-----------------------------*/
.logo{width:250px;}
#main_img{margin-top:14vh;}
#intro_txt{
  position:relative;
  padding-top:80px!important;
  background: url(./Dup/img/intro2.jpg) no-repeat;
  background-size:cover;
}

#main_img:before,#intro_txt:before,.contents_wrap:before,.top_cms_wrap:before{
  content:'';
  position:absolute;
  display:block;
  width:100%;
  height:80px;
  left:0;
  background-repeat:no-repeat;
  background-size:100% 100%;
  z-index:2;
}
#main_img:before,#intro_txt:before,.contents_wrap:before{
  bottom:-1px;
  background-image:url(./Dup/img/main.png);
}
.top_cms_wrap:before{
  top:0;
  background-image:url(./Dup/img/main2.png);
}
.contents_wrap{
  background:url(./Dup/img/con_bg.png) no-repeat;
  background-position:top 60% center;
  background-size:contain;
}
.contents_wrap,.top_cms_wrap,#info{position:relative;}
#contents{padding-top:100px;}
.box1 figure,.box2 figure,.box3 figure{position:relative;}
.box1 figure:before,.box2 figure:before,.box3 figure:before{
  position:absolute;
  display:block;
  font-size:5rem;
  font-family: 'Roboto Condensed', sans-serif;
  z-index:2;
  color:#3c90c0;
}
.box1 figure:before{
  content:'01';
  top:-50px;
  right:10px;
}
.box2 figure:before{
  content:'02';
  top:-50px;
  left:10px;
}
.box3 figure:before{
  content:'03';
  top:-50px;
  right:10px;
}
.top_cms_title{margin-bottom:50px;}
.cms_title h2{
  color:white;
  font-size:2rem;
}
.top_cms_box .more a{
  color:white;
  border:2px solid white;
}
.top_cms_box .more a:hover{
  transform:translateY(-3px);
}

#info{padding-top:0;}
#info_title_box{background-image:none!important;}
.info_title{margin-top:50px;}
.info_title span{
  font-size:3rem;
  font-family: 'Roboto Condensed', sans-serif;  
  background-color:transparent;
  color:#3c88b5;
}


/*----------------under page---------------------------------*/
#page_title #filter_white{
  background-color:transparent!important;
  padding-bottom:150px;
}
#page_title:after{
  content:'';
  position:absolute;
  display:block;
  width:100%;
  height:81px;
  background-image:url(./Dup/img/main.png);
  bottom:-1px;
  left:0;
  background-repeat:no-repeat;
  background-size:100% 100%;
  z-index:2;
}
.cate_list li{margin-right:20px;}
.cate_list li a{
  border-bottom:1px solid #333;
  padding:10px 0;
}
.cate_list li a:hover{
  transition:all 0.3s;
  transform:translateY(-3px);
}
.cms_5-c .box_txt1::before{color:white!important;}


/* ---------- responsive ---------- */
@media screen and (max-width: 862px){
#main_img{margin-top:15vh;}
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
header{padding-bottom:10px;}
#logo{margin-bottom:15px;}
.logo{width:200px;}
#main_img{margin-top:18vh;}
#main_img:before, #intro_txt:before, .contents_wrap:before{height:3vh;}
#contents {padding-top: 50px;}
.box1 figure:before, .box2 figure:before, .box3 figure:before{font-size:4rem;}
.top_cms_wrap:before{height:3vh;}
.top_cms_wrap{padding-top:0;}
.top_cms_title{padding-top:50px;}
#page_title:after{height:3vh;}
#page_title #filter_white {padding-top: 255px!important;}
}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
header{
  padding-bottom:0;
  margin-bottom:10px;
}
#header #logo{padding-top:10px;}
.logo {width: 200px;}
.font1{font-size:2rem;}
#main_img{margin-top:14vh;}
#main_img:before{
  height:4vh;
  bottom:5px;
}
.contents_title1{
  line-height:1;
  margin-bottom:0;
}
#contents h2{margin-bottom:0;}
#contents figure{margin-top:20px;}
.cms_title h2{font-size: calc(1rem + 6px);}
.top_cms_wrap{padding-bottom:50px;}
#info_title_box{
  padding-top:30px;
  padding-bottom:30px;
}
.info_title span {font-size: 2rem;}
#page_title #filter_white {padding-top: 155px!important;}
.menu_bt{margin-top:15px;}
}

/* ---------- IEの処理 ---------- */
@media all and (-ms-high-contrast: none){
header #header #header_menu li:last-child a span{padding-bottom:10px;}
header #header #header_menu li:last-child a span:nth-child(2){top:-45px;}
.more a{padding-top:3px;}
.pager li a span{padding-top:1px!important;}
#page_title h2 span{padding-top:14px;}
#cms_2-b .cate .cate_title{padding-top:10px!important;}
#page9 .box_wrap .box p a{padding:7px 10px 7px;}
}