﻿/*===========================================================*/
/* 個別 */
/*===========================================================*/
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500&family=Noto+Sans+JP:wght@500&display=swap');
body,.font_Quick{
    font-family: "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif"!important;
}
.linkStyle{color: #333;border-bottom: 1px solid;}
.youtube_box{
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.youtube_box iframe{
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}
#loading_line .line{    background-color: #80bce7;}
#main_img{overflow: inherit;max-height: inherit;}
.catch2{
    z-index: 2;
    max-width: 300px;
    bottom: -100px;
    width: 30%;
}

#top_contents2 h2{
    letter-spacing: 4px;
    background-image: linear-gradient(to bottom, #a4d7ff, #a4d7ff);
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: 50px 1px;
}
#top_contents2 h2{background-position: bottom left;}
#top_contents2 {
    padding: 130px 0 350px;
}
#top_contents2 .con_box:nth-of-type(1){margin-bottom: 350px;}
#top_banner a:hover .banner_bg,.about_bnr a:hover .banner_bg{
    opacity: 0.2;
    transform: translate(-50%, -50%) scale(1.1);
}
#top_contents1 h2,#top_contents2 p.txt_bg,#top_banner h2{
    padding: 50px 0;
    background-image: url(Dup/img/bg_txt03.png);
    background-repeat: no-repeat;
    background-position: center;
}
#top_contents1 h2{ background-image: url(Dup/img/bg_txt01.png);}
#top_contents2 p.txt_bg{background-image: url(Dup/img/bg_txt02.png);}
#top_banner a p,.about_bnr p{
    background-image: linear-gradient(to bottom, currentColor, currentColor);
    background-size: 0 1px;
    background-repeat: no-repeat;
    background-position: left bottom;
    transition: background-size 0.5s;
}
#top_banner a:hover p,.about_bnr a:hover p{
    background-size: 100% 1px;
}
.about_bnr{margin-top: -100px;}
#fix_bnr a:hover{transform: translateY(-10px);transition: 0.5s;}
/*===========================================================*/
/* コード集 */
/*===========================================================*/
.txt_anim1 span{
	position: relative;
	right: 20px;
	opacity: 0;
	transition: all .8s;
}
.txt_anim1 span.start{
	right: 0;
	opacity: 1;
}

#fix_bnr{
	bottom: 7px;
	right: 84px;
	z-index: 10;
	width: 300px;
}
#copyright{
	padding-bottom: 100px;
}
@media screen and (max-width: 667px){
#fix_bnr {bottom: 7px;right: 72px;width: 65%;}
#copyright{padding-bottom: 65px;}
}
/*===========================================================*/
/* 下層 */
/*===========================================================*/
#page_title h2{font-size: 50px;}
#page_title p{font-size: 18px;color: #006ebc;}
#page_title .title_box {
    box-shadow: 0 0 20px rgb(0 0 0 / 10%);
}


/*===========================================================*/
/* タブレット */
/*===========================================================*/
@media screen and (max-width: 768px){
.catch{width: 80%;text-align: center;top: 60%;}
.catch2 {
    bottom: -130px;
    width: 20%;
}
#top_contents1 h2, #top_contents2 p.txt_bg, #top_banner h2{background-size: 600px;}
#top_contents2 .con_box:nth-of-type(1) {
    margin-bottom: 100px;
}
#top_contents2 {
    padding: 130px 0 150px;
}
#top_contents2 .con_box .text_box {
    margin-left: inherit;
}


}



/*===========================================================*/
/* スマホ */
/*===========================================================*/
@media screen and (max-width: 667px){
    .catch2 {
    bottom: -80px;
}
    #top_contents1 h2, #top_contents2 p.txt_bg, #top_banner h2 {
    background-size: 350px;
}
#top_contents1 h2{background-image: none;}
#top_contents2 {
    padding: 50px 0 100px;
}
.bg_txt{width: 350px;}
#page_title h2 {
    font-size: 30px;
}
}


/*===========================================================*/
/* IE */
/*===========================================================*/
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none){



}


/*===========================================================*/
/* Firefox */
/*===========================================================*/
@-moz-document url-prefix(){

}