﻿@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@700&display=swap');
.font1,.cms_sub_title{font-family: 'Poppins', sans-serif;}

#loader img{width:350px!important;}
#logo a{
    background-color:transparent;
    width:300px!important;
}




/*--------top page---------------------------------------*/
.fix_bnr{
    right:10px;
    bottom:10px;
    z-index:10;
}
.fix_bnr a{border-radius:50px;}
.fix_bnr a:hover{transform:translateY(-3px);}
#main_bg{background: linear-gradient(to bottom right, rgb(2, 65, 153), rgb(137, 216, 253));}
.main_txt{text-shadow: 1px 1px 4px #333;}
.moji{
    font-size: 10rem;
    color:#0d79d4;
   /* opacity:0.5;*/
    position: absolute;
    bottom: -8%;
    left: 0;
    right: 0;
    margin: auto;
    text-shadow: 1px 1px 3px #333;
}
#intro,#contents1 .con1_wrap{padding-right:0!important;}
#contents1 .con1_bg{background:rgba(255,255,255,0.9)!important;}


#top_cms .pd_t-100px{
    background-size: auto auto;
    background-color: rgba(255, 255, 255, 1);
    background-image: repeating-linear-gradient(45deg, transparent, transparent 2px, rgba(245, 245, 245, 1) 2px, rgba(245, 245, 245, 1) 11px );
}

/*btn*/
.btn,
a.btn,
button.btn {
  /*font-size: 1.2rem;*/
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1rem 4rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
  border-radius: 0.5rem;
      background-color: #d6e653;
}
a.btn--red.btn--cubic {
  border-bottom: 5px solid #8c8c8c;
}

a.btn--red.btn--cubic:hover {
  margin-top: 3px;
  border-bottom: 2px solid #545454;
}

a.btn--radius {
  border-radius: 100vh;
}

.fa-position-right {
  position: absolute;
  top: calc(50% - .5em);
  right: 1rem;
}




/*--------under page---------------------------------------*/
#page_title .page_title_bg{
    opacity:0.3;
    background-color: #89d8fd;
}
#page_title .page_title_gradient{display:none;}
#page_title p{font-family: 'Poppins', sans-serif;}

/*faq page*/
#page6 .contents_wrap{
    padding-left:70px;
    padding-right:70px;
}
#cms_5-c .box_title1::before,#cms_5-c .box_txt1::before,.cms_5-c .box_title1::before,.cms_5-c .box_txt1::before{
  content:'';
  width:10px;
  height:10px;
  background-repeat:no-repeat;
  
}
#cms_5-c .box_title1::before,.cms_5-c .box_title1::before{
  background-image:url(./Dup/img/faq1.png);
  top:40%;
  left:-9px;
}
#cms_5-c .box_txt1::before,.cms_5-c .box_txt1::before{
  background-image:url(./Dup/img/faq2.png);
  bottom:0.5em;
  top:auto;
  left:auto;
  right:-9px;
}
#cms_5-c dl{margin-bottom:150px;}
.cp_qa *, .cp_qa *:after, .cp_qa *:before {
	-webkit-box-sizing: border-box;
	  box-sizing: border-box;
}
.cp_qa dt,.cp_qa dd {
	position: relative;
	padding: 0.5em;
	/*box-shadow: 0px 1px 1px rgba(0,0,0,0.2);*/
	border-radius: 0.3em;
}
.cp_qa dt {
	margin: 0 50px 30px;
	background: #024199;
}
.cp_qa dd {
	margin: 0 50px 30px;
	background: #f5f5f5;
}
/* 吹き出し▶︎ */
.cp_qa dt::before,.cp_qa dd::before{
	position: absolute;
	display: inline-block;
	content: '';
}
/* 質問吹き出し▶︎ */

.cp_qa dt::before {left: -0.5em;}
/* 答え吹き出し▶︎ */
.cp_qa dd::before {right: -0.5em;}

/* ?!アイコン */
.cp_qa dt::after,.cp_qa dd::after {
	position: absolute;
	display: inline-block;
	width: 3vw;
	height: 7vh;
	background-repeat:no-repeat;
	background-size:contain;
}
/* ?アイコン */
.cp_qa dt::after {
top:-0.3em;
	left: -3.5em;
	content: '';
	background-image:url(./Dup/img/faq3.png) ;
}
/* !アイコン */
.cp_qa dd::after {
	right: -4.5em;
	bottom:-1em;
	content:'';
	background-image:url(./Dup/img/faq4.png) ;
}


#page08 #form_box #occupation{
    height: 40px;
    border: 0!important;
    background-color: #f7f7f7;
}



/* ---------- responsive ---------- */
@media screen and (max-width: 1550px){
.cp_qa dt::after, .cp_qa dd::after{width:4vw;}
}

@media screen and (max-width: 1060px){
.cp_qa dt::after, .cp_qa dd::after{width:5vw;}
}



/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
#loader img{width:180px;}
#logo a{width:170px;}
.main_txt{
    font-size: calc(1rem + 7px);
    margin-bottom: 45px;
}
.moji{font-size:4rem;}
#contents1{background-position: center left;}
#contents1 .con1_title{letter-spacing:0;}
#page6 .contents_wrap {
    padding-left: 40px;
    padding-right: 40px;
}
.cp_qa dt::after, .cp_qa dd::after{width:7vw;}
.cms_1-e .date{letter-spacing:1px;}
#cms_5-c dl {margin-bottom: 100px;}
.footer_wrap{padding-bottom:100px;}

}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
#loader img{width:150px!important;}
#logo a{width:170px!important;}
.moji {
    font-size: 3rem;
    bottom: -25%;
}
.main_txt{
    text-shadow:none;
    font-size: calc(1rem + 5px);
}
#intro{padding-top:0;}
.intro_wrap{padding-top:20px;}
    #page6 .contents_wrap {
    padding-left: 10px;
    padding-right: 10px;
}
#intro .intro_title{text-align:center;}
#contents2 .con2_box{padding-top:50px;}
.btn_tel{text-align:center;}
.cp_qa dt::after, .cp_qa dd::after{width:15vw;}
.cp_qa dt::after{
    top: 0;
    left: -3.7em;
}
.cp_qa dt {margin: 0 10px 30px 50px;}
.cp_qa dd {margin: 0 50px 30px 10px;}
.cp_qa dd::after {right: -5.5em;}
.fix_bnr{
    right: 50px;
    bottom:0;
}
.fix_bnr a{
    height: 50px;
    border-radius:0;
}
.fix_bnr a:hover{transform:none;}
}

/* ---------- IEの処理 ---------- */
@media all and (-ms-high-contrast: none){
.fix_bnr a{padding-top:25px;}
.btn_tel a{padding-top:2em;}
.cms_5-c .box_title1,.cms_5-c .box_txt1,#cms_5-c .box_title1,#cms_5-c .box_txt1{padding-top:20px;}
#contact_tel a{padding-top:25px;}
}




/*-------------------------------------------------------
				ページタイトルアニメーション
-------------------------------------------------------*/
p > span > span{
     display: inline-block;
     -webkit-transform: translateY(20px);
     transform: translateY(20px);
     -webkit-animation: .35s cubic-bezier(.175,.885,.32,1.275) both;
     animation: .35s cubic-bezier(.175,.885,.32,1.275) both;
     opacity: 0;
}
p > span > span:nth-child(1){
-webkit-transition-delay: 200ms;transition-delay: 200ms;
-webkit-animation-delay: 200ms;animation-delay: 200ms;
}
p > span > span:nth-child(2){
-webkit-transition-delay: 250ms;transition-delay: 250ms;
-webkit-animation-delay: 250ms;animation-delay: 250ms;
}
p > span > span:nth-child(3){
-webkit-transition-delay: 300ms;transition-delay: 300ms;
-webkit-animation-delay: 300ms;animation-delay: 300ms;
}
p > span > span:nth-child(4){
-webkit-transition-delay: 350ms;transition-delay: 350ms;
-webkit-animation-delay: 350ms;animation-delay: 350ms;
}
p > span > span:nth-child(5){
-webkit-transition-delay: 400ms;transition-delay: 400ms;
-webkit-animation-delay: 400ms;animation-delay: 400ms;
}
p > span > span:nth-child(6){
-webkit-transition-delay: 450ms;transition-delay: 450ms;
-webkit-animation-delay: 450ms;animation-delay: 450ms;
}
p > span > span:nth-child(7){
-webkit-transition-delay: 500ms;transition-delay: 500ms;
-webkit-animation-delay: 500ms;animation-delay: 500ms;
}
p > span > span:nth-child(8){
-webkit-transition-delay: 550ms;transition-delay: 550ms;
-webkit-animation-delay: 550ms;animation-delay: 550ms;
}
p > span > span:nth-child(9){
-webkit-transition-delay: 600ms;transition-delay: 600ms;
-webkit-animation-delay: 600ms;animation-delay: 600ms;
}
p > span > span:nth-child(10){
-webkit-transition-delay: 650ms;transition-delay: 650ms;
-webkit-animation-delay: 650ms;animation-delay: 650ms;
}
p > span > span:nth-child(11){
-webkit-transition-delay: 700ms;transition-delay: 700ms;
-webkit-animation-delay: 700ms;animation-delay: 700ms;
}
p > span > span:nth-child(12){
-webkit-transition-delay: 750ms;transition-delay: 750ms;
-webkit-animation-delay: 750ms;animation-delay: 750ms;
}
p > span > span:nth-child(13){
-webkit-transition-delay: 800ms;transition-delay: 800ms;
-webkit-animation-delay: 800ms;animation-delay: 800ms;
}
p > span > span:nth-child(14){
-webkit-transition-delay: 850ms;transition-delay: 850ms;
-webkit-animation-delay: 850ms;animation-delay: 850ms;
}
p > span > span:nth-child(15){
-webkit-transition-delay: 900ms;transition-delay: 900ms;
-webkit-animation-delay: 900ms;animation-delay: 900ms;
}

p.is-show > span > span
{
     -webkit-animation-name: slide-bs;
     animation-name: slide-bs;
     opacity: 1;
}
@keyframes slide-bs{
     0%{-webkit-transform: translateY(20px);transform: translateY(20px);}
     100%{-webkit-transform: translateY(0);transform: translateY(0);}
}

