﻿@import url('https://fonts.googleapis.com/css2?family=Hammersmith+One&display=swap');
.font1,#contents_links .square_box a p,.top_cms_title span{font-family: 'Hammersmith One', sans-serif;}

#sc_menu .logo a {padding: 9px 20px;}
header #header #main_menu li a img,#sc_menu li a img {width: 25px;}
#header h1{width:20%;}
#main_img{margin-bottom:100px;}
#main_img #catch{background-color:rgba(47,65,139,0.8);}
#main_img #catch h2{border:0;}
#intro{background:#eee url(./Dup/img/bg.png);}
#intro_title p{
  font-family: 'Hammersmith One', sans-serif;
  border:0;
  border-bottom:3px solid #2f418b;
  font-size: 2rem;
  line-height: 1;
}
#intro .box_wrap{align-items:start;}
#intro .box_wrap .box > div{margin-left: 15%;}
#intro .box_wrap .box > div span{display:none;}
#contents_links .link_more span{
  font-size:2rem;
  font-weight: bold;
}
#contents_links .square_box:first-child{background:white;background-image:url(./Dup/img/link1.png)!important;}
#contents_links .square_box:nth-child(2){background:white;background-image:url(./Dup/img/link2.png)!important;}
#contents_links .square_box:last-child{background:white;background-image:url(./Dup/img/link3.png)!important;}
#contents_links .square_box:first-child,#contents_links .square_box:nth-child(2),#contents_links .square_box:last-child{
  box-shadow: 0 10px 30px rgba(0,0,0,0.08);
  background-repeat:no-repeat;
  background-position:center top -40px;
  background-size:100%;
}
#contents_links .square_box:hover{
  box-shadow:none;
  transition:all 0.3s;
}
#contents_links .square_box a{background-color:transparent;color: #2f418b;}
#contents_links .square_box a::before{border: 0;}
#contents_links .square_box a:hover{
  box-shadow:none;
  background-color:transparent;
}
#contents_links .square_box a p,#contents_links .square_box a h4{
  text-align:center;
  left:0;
  right:0;
  margin:auto;
}
#contents_links .square_box a:hover{
  letter-spacing:3px;
  transition:all 0.3s;
}
#contents_links .square_box a p{top:auto;bottom: 17%;}
#contents_links .square_box a h4{bottom: 25%;}
.link_more{transform: translateY(-400%);}




/* ---------- レスポンシブ ---------- */
@media screen and (max-width: 1470px){
#main_img #catch{top: 60%;}
}
@media screen and (max-width: 970px){
#main_img #catch{top: 70%;}
}




/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
#header h1{width:25%;}
#contents_links .square_box{margin:10px;}
.fa-long-arrow-alt-right:before{display:none;}
.link_more {transform: translateY(-250%);}
}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
#header h1 {width: 45%;}
h1 a {padding: 10px 10px;}
h1 img {max-width: 300px;}
#contents_links .square_box{
    background-position: center top -55px;
    background-size: 90%;
}
.link_more {transform: translateY(-130%);}
#contents_links .square_box a p{bottom:8%;}
#contents_links .square_box a h4 {bottom: 20%;}
#contents_links .square_box:first-child, #contents_links .square_box:nth-child(2), #contents_links .square_box:last-child{background-position: center top -80px;}
#intro .box_wrap .box > div{margin-left:10%;}
.cate_list li{margin-right:0!important;}
}

/* ---------- IEの処理 ---------- */
@media all and (-ms-high-contrast: none){
#cms_2-a .cate .cate_title{padding-top:10px!important;}
#cms_6-b .cate .cate_title{padding:3px 5px 3px!important;}
}