@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@1,900&display=swap');

body, .font_Quick{font-family: 'Noto Sans JP', "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif!important;}

.main_txt{font-family: 'Roboto','Noto Sans JP', "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif!important;font-weight: 900}

#header, .overlay, #top_contents1 h2, #top_contents2 h2, .top_cms_title h2, .more a, .box_title1, .service_wrap, #top_contact_box, .info_txt h3, .tel_bt a, #footer_nav, .cate_title, #page_title, #contact_tel, #contact_tel2, #contact_mail, #top_contents1 h2::after, .top_cms_title p, .top_info_title p, #page_title p, .info_title_inner h2, .btn a .txt, .cms_6-a a p {font-weight: 900} 

#top_contents1 h2, #top_contents2 h2, .box_title1, .cate_title {font-weight: 600;}


/* color ---------------------------------------------------------------------------------------------*/
.linkStyle{color: #FF8300;transition: opacity .3s;}
.linkStyle:hover{opacity: 0.7}
body,.txt_color_nomal{color: #333333;}
.txt_white{color: white;}
.txt_red{color: red;}
.txt_color1{color: #FF8300} /* メインカラー */
.txt_color2{color: #e6e6e6} /* サブカラー */
.txt_color3{color: #333} /* アクセントカラー1 */
.txt_color4{color: #f1f4f9} /* アクセントカラー2 */

/* background-color */
.bg_white{background-color: white} /* 白背景 */
.bg_black{background-color: black} /* 黒背景 */
.bg_color1{background-color: #FF8300} /* メインカラー */
.bg_color2{background-color: #e6e6e6} /* サブカラー */
.bg_color3{background-color: #333} /* アクセントカラー1 */
.bg_color4{background-color: #f1f4f9} /* アクセントカラー2 */
.bg_color_clear{background-color: transparent!important}

/* border-color ※!important */
.border_color1{border-color: #FF8300}
.border_color2{border-color: #e6e6e6}
.border_color3{border-color: #333}
.border_color4{border-color: #ccc}

/* hover_color */
.hvr_txt_color_nomal:hover{color: #333333;}
.hvr_txt_white:hover{color: white;}
.hvr_txt_red:hover{color: red;}
.hvr_txt_color1:hover{color: #FF8300} /* メインカラー */
.hvr_txt_color2:hover{color: #e6e6e6} /* サブカラー */
.hvr_txt_color3:hover{color: #333} /* アクセントカラー1 */
.hvr_txt_color4:hover{color: #f1f4f9} /* アクセントカラー2 */

.hvr_bg_white:hover{background-color: white} /* 白背景 */
.hvr_bg_black:hover{background-color: black} /* 黒背景 */
.hvr_bg_color1:hover{background-color: #FF8300} /* メインカラー */
.hvr_bg_color2:hover{background-color: #e6e6e6} /* サブカラー */
.hvr_bg_color3:hover{background-color: #333} /* アクセントカラー1 */
.hvr_bg_color4:hover{background-color: #e1f5ea} /* アクセントカラー2 */
.hvr_bg_color_clear:hover{background-color: transparent!important}

.hvr_border_color1:hover{border-color: #FF8300}
.hvr_border_color2:hover{border-color: #e6e6e6}
.hvr_border_color3:hover{border-color: #333}
.hvr_border_color4:hover{border-color: #f1f4f9}


#loading_line .line{background: linear-gradient( 80deg,#ff8300 0%,#f54141 91%)}
#header .mail_bt a {
    background: linear-gradient( 80deg,#ff8300 0%,#f54141 91%);
    font-size: 19px;
}
#header .mail_bt a:hover{opacity: 0.7}
#header .tel_bt{padding-top: 10px}
#header .tel_bt a{font-size: 22px;padding-left: 37px;}
#header .tel_bt a i{font-size: 27px;}
#header .contact_box{align-items: flex-start;}
#header .contact_box{transform: translateY(0px)!important;}


/* all ---------------------------------------------------------------------------------------------*/
#header{
	font-weight: 600;
    position: absolute;
    z-index: 99;
    width: 100%;
    box-sizing: border-box;
}
#header-nav span.txt_color_nomal {
    font-size: 15px;
    color: #ffffff;
	letter-spacing: 2px;
}
#header-nav li a .before{
	height: 1px;
	background-color: #ffffff;
}
.more a:hover{transform: scale(1.05)}




/* top ---------------------------------------------------------------------------------------------*/
#main_img {
    max-height: 100vh!important;
    height: 100vh;
}

#main_img::before {
    display: inline-block;
    content: "";
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.3);
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    z-index: 2;
	background: linear-gradient(355deg, rgba(0,0,0,0.06) 0%, rgba(0,0,0,0.18) 100%);
}
.main_txt {
    position: absolute;
    text-align: center;
    top: 49%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 65px;
    width: 90%;
    letter-spacing: -4px;
    font-weight: bold;
    z-index: 3;
    font-style: italic;
}
.main_txt2 {
    position: absolute;
    text-align: center;
    top: 58%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 25px;
    width: 90%;
    letter-spacing: 2px;
    font-weight: 900;
    z-index: 3;
    width: 476px;
    padding: 5px 5px 7px 5px;
	overflow: hidden;
}
.main_txt2::before {
    content: '';
    display: inline-block;
    width: 100%;
    height: 100%;
    background-color: #333;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    z-index: -2;
}
.main_txt2::after{
   	content: '';
    display: inline-block;
    width: 100%;
    height: 100%;
    background-color: #FF8300;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
	z-index: 4;
}

.con1_sub_title{
	font-size: 54px!important;
    color: #47c17e;
    background: -webkit-linear-gradient(0deg, #ffffff, #47c17e, #fff700);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin: auto;
    text-align: center;
	font-weight: 900;
}
#top_contents1 {
    z-index: 1;
    position: relative;
    overflow: hidden;
    background-image: repeating-linear-gradient(90deg, #ebebeb 0, #f1f4f9 1px, #ffffff 0, #ffffff 50%);
    background-size: 261px 32px;
}
#top_contents1 h2 {font-size: 43px;color: #303030;}
#top_contents2 h2{font-size: 27px;}
#top_contents1 .txt_color_nomal{font-size: 16px;}
#top_contents1 .more {width: 350px;}
#top_contents1 .more a {
    color: #fff;
    background: linear-gradient( 80deg,#ff8300 0%,#f54141 91%);
	font-weight: 600;
    font-size: 19px;
	padding: 17px 15px;
}
#top_contents1 .more a {
	outline: 1px solid;
	outline-color: #ff8300;
	outline-offset: 0px;
	transition: .3s;
}
#top_contents1 .more a:hover {
  animation: light .8s infinite;
}
@keyframes light {
  100% { 
    outline-color: transparent;
    outline-offset: 12px;
  }
}
#top_contents1 .more a:hover{background-color: #999999;}
#top_contact_box .bottom .btn_box:nth-of-type(2) p{padding-right: 123px;}
#top_contact_box .bottom .btn_box:nth-of-type(3) p{padding-right: 59px;}
#top_contact_box .fa-envelope:before {
    content: "\f086"!important;
}
.bgroop {
	position: absolute;
    z-index: -1;
    width: 100%;
    height: 215px;
    top: 56px;
    left: 0;
    background: url(../dup/img/loop_txt.svg) repeat-x;
    background-size: 3000px;
    background-position: 0 100%;
    -webkit-animation: bgroop 40s linear infinite;
    animation: bgroop 40s linear infinite;
}
@-webkit-keyframes bgroop {
    from {background-position: 0  100%;}
    to {background-position: -1956px 100%;}
}
@keyframes bgroop {
    from {background-position: 0 100% ;}
    to {background-position: -1956px 100%;}
}
@keyframes bgroop_ie {
    from {background-position: 0 48% ;}
    to {background-position: -1956px 48%;}
}


#top_contents2 .sub_title{
	color: #47c17e;
    font-weight: 900;
    font-size: 20px;
	position: relative;
	margin-bottom: 5px;
}
#top_contents2 .sub_title::before {
    display: inline-block;
    content: "";
    width: 57px;
    height: 2px;
    background: #47c17e;
    position: absolute;
    bottom: 0;
    left: 108px;
    top: 0;
    margin: auto;
}
#top_contact_box a i{top: 56%;}
#top_contact_box .con_bt a i{left: -31px;}


/* top_cms---------------------------------------------------------------------------------------------*/
.bgroop2::before {
    position: fixed;
    content: "";
    width: 100%;
    height: 100%;
    bottom: 0;
    right: 0;
    background: url(../dup/img/loop_txt2.svg) repeat-y;
    background-size: 210px;
    background-position: 0 110%;
    background-attachment: fixed;
    -webkit-animation: bgroop2 135s linear infinite;
    animation: bgroop2 135s linear infinite;
	z-index: -1;
}
@-webkit-keyframes bgroop2 {
    from {background-position: 0 110%;}
    to {background-position:  0 1956px;}
}
@keyframes bgroop2 {
    from {background-position: 0 110%;}
    to {background-position:  0 1956px;}
}
@keyframes bgroop2_ie {
    from {background-position: 73% 110%;}
    to {background-position: 73% 1956px;}
}
.top_cms_title p, .top_info_title p {
    font-size: 54px;
    color: #333333;
    margin: auto;
    text-align: center;
    overflow: hidden;
    height: 73px;
}



/* under ---------------------------------------------------------------------------------------------*/
#page_title p{font-size: 22px;letter-spacing: 2px;}
#cms_2-a .cate .cate_box:last-of-type{border-bottom: 1px solid #FF8300;}
#cms_6-a .cate_title{background-color: #f5f5f5;color: #333;border-color: #47c17e;}
#cms_6-a .box_wrap{border: 1px solid;padding: 0;}
#cms_6-a .cate_box{border-bottom: none;padding: 25px 20px;}
#cms_6-a .cate_box:nth-child(2n+1){background-color: #f7f7f7;}
#cms_5-b .cate_box .box_item, .cms_5-b .cate_box .box_item {border-color: #47c17e;}
#cms_5-b .cate_box .box_item, .cms_5-b .cate_box .box_item{border-color: #afafaf;}
#cms_5-b .cate_box .open_bt .box_title1::before{color: #ff8300!important;}
#cms_2-a .box_title1{color: #47c17e!important;}
#cms_1-a .date{border-color: #47c17e;}
.cate_list li a{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}



/* anim ---------------------------------------------------------------------------------------------*/
.txt_anim span, .main_txt span{
    -webkit-transition: opacity .8s cubic-bezier(.215,.61,.355,1),-webkit-transform .8s cubic-bezier(.215,.61,.355,1);
    transition: opacity .8s cubic-bezier(.215,.61,.355,1),-webkit-transform .8s cubic-bezier(.215,.61,.355,1);
    transition: transform .8s cubic-bezier(.215,.61,.355,1),opacity .8s cubic-bezier(.215,.61,.355,1);
    transition: transform .8s cubic-bezier(.215,.61,.355,1),opacity .8s cubic-bezier(.215,.61,.355,1),-webkit-transform .8s cubic-bezier(.215,.61,.355,1);
    position: relative;
    display: inline-block;
    letter-spacing: .13em;
    opacity: 0;
    -webkit-transform: translateX(-60%);
    transform: translateX(-60%);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.txt_anim span{
	letter-spacing: 2px;
}
.txt_anim span.start, .main_txt span.start{
	opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
.main_txt span.start{animation:glow_anime_on 1s ease-out 1;}

@keyframes glow_anime_on{
	0% { opacity:0; text-shadow: 0 0 0 #fff,0 0 0 #fff;}
	50% { opacity:1;text-shadow: 0 0 10px #fff,0 0 15px #fff; }
	100% { opacity:1; text-shadow: 0 0 0 #fff,0 0 0 #fff;}
}

/*--- fadein ------------------------------------*/
.fadein{
	transform: translateY(20px);
	transition: transform 1.5s ease, opacity 2s;
	transition-property: opacity,transform;
	opacity: 0;
}
.fadein.start{transform: translateY(0);opacity: 1;}


/*--- main_txt2 ------------------------------------*/
.inner_txt{
	transition: all .6s ease .8s;
	opacity: 0;
}
.main_txt2::before, .main_txt2::after{
	opacity: 0;
	-webkit-transform: translateX(-100%);
    transform: translateX(-100%);
	transition: transform .6s ease .6s;
}
.main_txt2::before{
	transition-delay: .6s
}
.main_txt2::after{
	transition: transform .6s ease .6s;
}
.main_txt2.start .inner_txt{
	opacity: 1;
	transition-delay: .9s
}
.main_txt2.start::before, .main_txt2::after {
	opacity: 1;
}
.main_txt2.start::after{
	-webkit-transform: translateX(100%);
    transform: translateX(100%);
}
.main_txt2.start::before{
	-webkit-transform: translateX(0);
    transform: translateX(0);
	transition-delay: 1s
}
.cms_5-b .cate_box .open_bt .box_title1::before{color: #ff8300!important;}
#contact_mail a{width: 95%!important;box-sizing: border-box}



/* IE */
@media all and (-ms-high-contrast: none){
.bgroop{animation: bgroop_ie 40s linear infinite;}
.bgroop2::before{background-size: 5600px;animation: bgroop2_ie 135s linear infinite;}
	
#cms_5-b .cate_box .arrow, .cms_5-b .cate_box .arrow{margin-top: -14px!important;}
#cms_5-b .cate_box .open_bt .box_title1::before, .cms_5-b .cate_box .open_bt .box_title1::before{top: -2px!important;}
#page9 a{padding-top: 3px!important}
.mail_bt a{padding: 10px 28px!important}
.tel_bt a i{transform: translateY(-47%)!important}
.overlay .menu-box .tel_bt a i{transform: translateY(-33%)!important}
#cms_6-a .cate .cate_title{padding-top: 10px!important}
.font_Quick .cate_list li a{padding: 14px 15px 15px!important}
#cms_2-a .cate .cate_title{padding-top: 9px!important}
#top_cms .more a{padding: 15px!important;}
#top_contact_box .tel_bt .posi_center{top: 48%!important;}
#top_contact_box a i{top: 53%!important;}
#top_contact_box .con_bt .posi_center{top: 47%!important}
#top_contact_box .con_bt a i{transform: translateY(-42%)!important}
#page10 a .txt{padding-bottom: 19px!important;}
}

/* ---------- 1280 ---------- */
@media screen and (max-width: 1280px){
#top_contents1 h2 {font-size: 38px;}
}

@media screen and (max-width: 1168px){
#header .mail_bt a{font-size: 16px;}
#header .tel_bt a{font-size: 19px;}
#header .tel_bt{padding-top: 6px;}
}

@media screen and (max-width: 1080px){
#top_contact_box .bottom .box {height: 440px;}
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
.overlay{top: 60px;}
#logo{height: 59px;}
#logo h1.logo{max-width: 224px;left: 2px;}
#header {
    z-index: 999;
    width: 80%!important;
	position: fixed;
}
#fix_menu {padding: 28px 0 29px;}
.main_txt{font-size: 51px;}
#top_contents1 h2{font-size: 31px}
.bgroop{background-size: 2500px;top: 37px;}	
.bgroop2::before{background-size: 169px;}
#top_contact_box .bottom .btn_box:nth-of-type(2) p {padding-right: 0;}
.cms_6-a a p{font-size: 18px}
}


/* ---------- スマホ ---------- */
@media screen and (max-width: 667px){
#logo{height: 59px;width: 62%!important;}
#logo h1.logo{max-width: 211px;left: 12px;}

.main_txt {font-size: 46px;line-height: 1.1;top: 50%;}
.main_txt2 {top: 66%;font-size: 16px;width: 100%;}
#top_contents1 {padding: 50px 30px 75px;overflow: hidden}
#top_contents1 .catch_txt {padding-top: 24px;}
.bgroop {
    background-size: 1300px;
    top: 22px;
    height: 100px;
}
.con1_sub_title{font-size: 31px!important;}
#top_contents1{background-size: 166px 32px;background-image: repeating-linear-gradient(90deg, #f9f9f9 0, #f1f4f9 1px, #ffffff 0, #ffffff 50%);}
#top_contents1 h2{font-size: 23px}
#top_contents1 .txt_color_nomal {font-size: 14px;}
#top_contents2 h2 {font-size: 20px;}
#top_contents1 .more {margin-top: 50px;width: 87%!important;}
#top_contents1 .more a{font-size: 16px}
.bgroop2::before{display: none}
.top_cms_title p, .top_info_title p {
    font-size: 37px;
    height: 54px;
}
.cms_6-a .box_title1{font-size: 20px}
#top_contact_box .bottom .box {height: auto;}
#contact_mail a{width: 100%!important;box-sizing: border-box}

}