a{  
text-decoration:none;
} .wp-block-post-template.is-layout-grid {
display: flex;
flex-wrap: wrap;
gap: 16px;
padding: 0;
margin: 0;
list-style: none;
}
.wp-block-post-template.is-layout-grid > li.wp-block-post {
box-sizing: border-box;
display: flex;
flex-direction: column;
flex: 0 0 calc(50% - 8px); }
.wp-block-post-template.is-layout-grid > li.wp-block-post > .wp-block-group.menu_cover {
flex-grow: 1;
display: flex;
flex-direction: column;
height: 100%;
} .wp-block-post-featured-image {
width: 100%;
aspect-ratio: 16 / 9;
overflow: hidden;
display: block;
margin: 0;
}
.wp-block-post-featured-image img {
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
display: block;
} .wp-block-post-template.is-layout-grid li.wp-block-post .wp-block-post-title,
.wp-block-post-template.is-layout-grid li.wp-block-post .wp-block-post-date,
.wp-block-post-template.is-layout-grid li.wp-block-post .wp-block-group p,
.wp-block-post-template.is-layout-grid li.wp-block-post .wp-block-post-excerpt {
padding-left: 3px !important;
padding-right: 3px !important;
margin: 0 !important;
} .wp-block-post-template.is-layout-grid li.wp-block-post .wp-block-post-excerpt {
white-space: normal !important;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
} @media screen and (min-width: 768px) {
.wp-block-post-template.is-layout-grid > li.wp-block-post {
flex: 0 0 calc(50% - 8px); }
}
@media screen and (min-width: 1024px) {
.wp-block-post-template.is-layout-grid > li.wp-block-post {
flex: 0 0 calc(25% - 12px); }
} @media screen and (max-width: 991.98px) {
.custom-header-padding {
   padding: 5px 20px; }
} @media screen and (min-width: 992px) {
.custom-header-padding {
padding: 15px 15px; }
}
.treat1{
position: absolute;
top:-10px;
z-index:-1;
width: 70px;
left: -45vw;
}
.button-54 {
display: flex;
justify-content: center;
align-items: center;
position: relative;
width: 400px;
margin: 0 auto;
padding: .9em 3em .9em 2em;
border: 2px solid #2589d0;
border-radius: 100px;
background-color: #fff;
color: #2589d0;
font-size: 1em;
}
.button-54::after {
position: absolute;
right: 2em;
transform: translateY(-50%);
transform-origin: left;
width: 2em;
height: .5em;
background-color: #2589d0;
clip-path: polygon(0 100%, 100% 100%, 70% 40%, 70% 90%, 0% 90%);
content: '';
transition: transform .3s;
}
.button-54:hover::after {
transform: translateY(-50%) scaleX(1.4);
}
.button-54 a{
color: #2589d0;} .button-1 {
display: flex;
justify-content: center;
align-items: center;
width: 260px;
margin:0 auto;
padding: .9em 0em;
border: 1px solid #000;
border-radius: 100px;   
background-color: transparent;
color: #000;
font-size: 1em;
}
.button-1 a{
color: #000;
}
.button-1::after {
transform: rotate(45deg);
width: 5px;
height: 5px;
margin-left: 10px;
border-top: 2px solid #0693e3;
border-right: 2px solid #0693e3;
content: '';
} @media screen and (max-width: 575.98px) {
.header-padding{
padding:5px;
}
} @media screen and (min-width: 576px) {
.header-padding{padding:10px;
}
} @media screen and (min-width: 992px) {
.header-padding{padding:0px 0px 0px 20px;
}
}
.menu_btn {
font-size:0.75rem;
}
.menu_btn {
display: inline-block;
text-align: center;
text-decoration: none;
outline: none;
color:#5b5b5b;
border-bottom:　2px;
}
.sample_btn a {
position: relative;
}
.sample_btn a::after {
position: absolute;
left: 0;
content: '';
width: 100%;
height: 2px;
background: #0693e3;
bottom: -2px;
transform: scale(0, 1);
transform-origin: right top;
transition: transform 0.5s;
}
.sample_btn a:hover::after {
transform: scale(1, 1);
transform-origin: left top;
} .wp-block-navigation__responsive-container-open.wp-block-navigation__responsive-container-open.wp-block-navigation__responsive-container-open{
border:none;
} #page_top{
display:none;
}  @media screen and (max-width: 575.98px) { .top-slider-cover2{
position:relative;
top:-30vh;
left:0vw;
} .top-slider-cover3{
position:relative;
top:-30vh;
left:0vw;
}
.catch-phrase{
font-size:7.5vw;
position:relative;
left:5vw;
text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.5); }
.sub-phrase{
font-size:4vw;
position:relative;
left:5vw;
}
.title-text{
position:relative;
left:5vw;
width:90vw;
}
}
@media screen and (min-width: 576px) { .top-slider-cover2{
position:relative;
top:-25vh;
left:5vw;
}
.catch-phrase{
font-size:7.5vw;
}
.sub-phrase{
font-size:4vw;
}
} @media screen and (min-width: 992px) {
.top-slider-cover3{
position:relative;
left:5vw;
top:5vh;
}
.catch-phrase{
font-size:3.5vw;
text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.5); }
.sub-phrase{
font-size:2vw;
}
.text-shadow{text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.5); }
} .news-date{
font-weight: bold;
}
@media screen and (max-width: 575.98px) {
.slider-width{width:100vw;
}
} @media screen and (min-width: 576px) {
.slider-width{
width:90vw;
}
} @media screen and (min-width: 992px) {
.slider-width{
width:60vw;
}
} .news_title{
display: flex;
align-items: center;
justify-content: center;
} .news-box{
margin: 0 auto;
}  @media screen and (min-width: 992px) {
.news-box{
width:70vw;
}
} .news-title{
position:relative;
display:inline-block;
padding:0 40px;
text-align:center;
}
.news-title:before{
position:absolute;
top:calc(50%);
width:30px;
height:10px;
content:''; 
border-top:solid 3px #009FE6 ;
}
.news-title:before{
left:0;
}
.kp-heading-line{
display: flex; align-items: center;
gap: 12px;
width: 100%; margin: 0 auto;
text-align: center;
}
.kp-heading-line:before{
content:"";
display:block;
width: 30px;
border-top: 3px solid #009FE6;
}
.kp-heading-line-white{
display: flex; align-items: center;
justify-content: center;
gap: 12px;
width: 100%; margin: 0 auto;
text-align: center;
}
.kp-heading-line-white::before,
.kp-heading-line-white::after{
content:"";
display:block;
width: 30px;
border-top: 3px solid #fff;
}
.kp-heading-line-black{
display: flex; align-items: center;
justify-content: center;
gap: 12px;
width: 100%; margin: 0 auto;
text-align: center;
}
.kp-heading-line-black::before,
.kp-heading-line-black::after{
content:"";
display:block;
width: 30px;
border-top: 3px solid #000;
} .about-title-b{
position:relative;
display:inline-block;
padding:0 40px;
text-align:center;
}
.about-title-b:before{
position:absolute;
top:calc(50% );
width:30px;
height:10px;
content:''; 
border-top:solid 3px #009FE6 ;
}
.about-title-b:before{
left:0;
} .about-title-w{
position:relative;
display:inline-block;
padding:0 40px;
text-align:center;
}
.about-title-w:before{
position:absolute;
top:calc(50% );
width:30px;
height:10px;
content:''; 
border-top:solid 3px #fff ;
}
.about-title-w:before{
left:0;
} .height_max{
height:100%;
display:flex;
flex-direction:column;
align-items:center;
justify-content: center;
} .nf-form-title{
display:none;
} .line-icon{
position:relative;
}
@media screen and (min-width: 992px) {
.line-icon{
width:30vw;
}
} @media screen and (max-width: 575.98px) {
.roof {
position: relative;
width: 0;
height: 0;
border-left: 50vw solid transparent; border-right: 50vw solid transparent; border-bottom: 15vw solid #0693e3; }
} @media screen and (min-width: 576px) and (max-width: 991.98px) {
.roof {
position: relative;
width: 0;
height: 0;
border-left: 50vw solid transparent; border-right: 50vw solid transparent; border-bottom: 15vw solid #0693e3; }
} @media screen and (min-width: 992px) {
.roof {
position: relative;
width: 0;
height: 0;
border-left: 50vw solid transparent; border-right: 50vw solid transparent; border-bottom: 5vw solid #0693e3; }
} @media screen and (max-width: 575.98px) {
.message-back-ground{
position: absolute;
top:25vh;
z-index:-1;
}
} @media screen and (min-width: 576px) {
.message-back-ground{
position: absolute;
top:15vh;
width:90vw;
z-index:-1;
}
} @media screen and (min-width: 992px) {
.message-back-ground{
position: absolute;
z-index:-1; 
top: 70%;
left: 50%;
width:50vw;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%); 
}
} .text {
text-shadow: 0 0 40px #ffffff
} .marker-yellow {
background: linear-gradient(transparent 60%, #ffde59 50%);
} .marker-green{
background: linear-gradient(transparent 60%, #bdf9c6 50%);
}  @media screen and (max-width: 575.98px) {
.menu-icon{
width:50px;
}
} @media screen and (min-width: 992px) {
.menu-icon{
width:70px;
}
}  @media screen and (max-width: 575.98px) {
.q-and-a-width{
width:90vw;
}
} @media screen and (min-width: 576px) {
.q-and-a-width{
width:40vw;
}
} @media screen and (min-width: 992px) {
.q-and-a-widthn{
width:20vw;
}
} @media screen and (min-width: 576px) {
.text-aline{
text-align:center;
}
} @media screen and (min-width: 992px) {
.text-aline{
text-align: start;
}
} @media screen and (max-width: 575.98px) {
.about-content-cover{
width:80vw
}
} @media screen and (min-width: 576px) {
.about-content-cover{
width:70vw
}
} @media screen and (min-width: 992px) {
.about-content-cover{
width:40vw
}
} @media screen and (max-width: 575.98px) {
.menu-contents-width{
width:90vw
}
} @media screen and (min-width: 576px) {
.menu-contents- 
width{width:80vw
}
} @media screen and (min-width: 992px) {
.menu-contents- 
width{width:80vw
}
} #nf-label-field-15 {
margin: 0 auto;} .nf-form-content input[type=submit]{
background-color: #046da2;
} #nf-field-8-container{
display: flex;
align-items: center;
justify-content: center;
}
.ninja-code-text{
text-align: center;
} #nf-field-21-container {
display: flex;
align-items: center;
justify-content: center;
} #nf-label-field-24 {
margin: 0 auto;} .value-cover{
overflow:hidden;
} .cover-border-radius{ border-radius: 15px;} .about-content-cover{width:80vw
} @media screen and (max-width: 575.98px) {
.works-width{width:90vw;
}
} @media screen and (min-width: 576px) {
.works-width{width:65vw;
}
} @media screen and (min-width: 992px) {
.works-width{width:30vw;
}
} @media screen and (max-width: 575.98px) {
.image-width{width:80vw
}
} @media screen and (min-width: 576px) {
.image-width{width:70vw
}
} @media screen and (min-width: 992px) {
.image-width{width:40vw
}
}  @media screen and (max-width: 575.98px) {
.midashi-cover{
width:90vw;
}
} @media screen and (min-width: 576px) {
.midashi-cover{
width:70vw;
}
} @media screen and (min-width: 992px) {
.midashi-cover{
width:40vw;
}
} @media screen and (max-width: 575.98px) {
.number_icon{
 width:90px;
} 
} @media screen and (min-width: 576px) {
.number_icon{
width:100px;
} 
} @media screen and (min-width: 992px) {
.number_icon{
width:130px;
} 
} .menu_cover_hiddenoff{
border-radius: 3px;
position: relative;
}     @media screen and (min-width: 992px) {
.menu-content-width
{
width:65vw;
}
} .menu-title-inline{
display:inline;
}  @media screen and (max-width: 575.98px) {
.detail-menu-contents-width{width:80vw
}
} @media screen and (min-width: 576px) {
.detail-menu-contents-width{width:70vw
}
} @media screen and (min-width: 992px) {
.detail-menu-contents-width{width:70vw
}
} .recruit-table{
vertical-align:top;
} #sp-ea-7760 .ea-header{
background-color: #d0e7f6;
} #sp-ea-7768 .ea-header{
background-color:#C2E5C2;
} #sp-ea-7785 .ea-header{
background-color:#F7DCDC;
} #sp-ea-7786 .ea-header{
background-color:#f5efd0;
} #sp-ea-7787 .ea-header{
background-color:#ffd7c0;
} .position_relative{
position: relative;
}
.position_up20vh{
position: absolute;
top:10vh;
left:50vw;
z-index:-1;
}
.position_up10vh{
position: absolute;
top:10vh;
left:50vw;
z-index:-1;
}
.z-index1{
z-index:100;
} .center{
display:inline-block;
} @media screen and (max-width: 575.98px) { .position1{
padding-left:20vw;
} .position2{
position: absolute;
top:5vh;
z-index:2;
width:80vw
} .position3{
position:relative;
top:3vh;
z-index:-1;
width:60vw;
left:-15vw;
} .text-cover1{
padding:0 5vw 0 5vw; } .text-cover2{
padding-top:3vh;
}
} @media screen and (min-width: 576px) { .position2{ position:absolute;
top:-10vh;
z-index:-1;
width:40vw;
} .position3{
width:40vw;
top: 7vh;
}
} @media screen and (min-width: 992px) { .position1{
padding-left:5vw;
} .position2{
position: absolute;
top:-20vh;
z-index:-1;
width:30vw
} .position3{
position: relative;
top:5vh;
z-index:-1;
width:20vw;
left:-30vw; }
.position4{
position: relative;
top:-20vh;
z-index:30;
width:40%;
} .text-cover1{
position:relative;
padding:0vw;
width:80%;
} .text-cover2{
position:relative;
width:90%;
} .text-cover3{
position:relative;
left:5vw;
width:80%;
} .image1{
position:absolute;
top:2vh;
left:25vw;
z-index:-1;
width:10vw;
height:10vw;
} .image2{
position:absolute;
top:10vh;
left:29vw;
z-index:-2;
width:8vw;
height:8vw;
} .image3{
position:absolute;
top:2vh;
left:-10vw;
z-index:-1;
width:15vw;
height:15vw;
} .image4{
position:absolute;
top:18vh;
left:-12vw;
z-index:-2;
width:10vw;
height:10vw;
}
} @media screen and (max-width: 575.98px) {
.content-box{width:80vw
}
} @media screen and (min-width: 576px) {
.content-box{width:50vw
}
} @media screen and (min-width: 992px) {
.content-box{width:60vw
}
} @media screen and (max-width: 575.98px) {
.instagram-content-width{
width:90vw;
}
} @media screen and (min-width: 576px) {
.instagram-content-width{
width:80vw;
}
} @media screen and (min-width: 992px) {
.instagram-content-width{
width:50vw;
}
} @media screen and (max-width: 575.98px) {
.line-title-width{width:90vw
}
.line-content-width{
width:60vw;
}
} @media screen and (min-width: 576px) {
.line-title-width{width:50vw;
}
.line-content-width{
width:50vw;
}
} @media screen and (min-width: 992px) {
.line-title-width{width:50vw
}
.line-content-width{
width:50vw;
}
}/*/*//**/@media screen and (max-width: 575.98px) {
.line-title-width{width:90vw
}
.line-content-width{
width:60vw;
}
} @media screen and (min-width: 576px) {
.line-title-width{width:50vw;
}
.line-content-width{
width:50vw;
}
} @media screen and (min-width: 992px) {
.line-title-width{width:50vw
}
.line-content-width{
width:50vw;
}
} @media screen and (max-width: 575.98px) {
.font-size{
font-size:7vw;}
.word-image{width:70vw;
}
} @media screen and (min-width: 576px) {
.font-size{
font-size:7vw;}
.word-image{width:60vw;
}
} @media screen and (min-width: 992px) {
.font-size{
font-size:5vw;}
.word-image{width:30vw;
}
}
.position-relative{
position: relative;
}
.position-absolute{
position:absolute;
} .heading-1 {
padding: 1em .3em;
border-left: 7px solid #12B1FF;
}
.heading-20 {
padding: .5em .7em;
background-image: repeating-linear-gradient(-45deg, #bbdbfb, #bbdbfb 3px, #f2f6fc 3px, #f2f6fc 7px);
color: #333333;
}  @media screen and (max-width: 575.98px) {
.font-size-change1{
font-size:5vw;
color:#fff;
}
.font-size-change2{
font-size:9vw;
color: #FFFF55;}
.font-size-change3{
font-size:6vw;
}
.font-size-change4{
font-size:6vw;
}
} @media screen and (min-width: 576px) {
.font-size-change1{
font-size:2.5rem;
color:#fff;
}
.font-size-change2{
font-size:2.5rem;
color: #FFFF55;
}
.font-size-change3{
font-size:9vw;
}	
.font-size-change4{
font-size:2.5rem;
}	   
} @media screen and (min-width: 992px) {
.font-size-change1{
font-size:2.5rem;
color:#fff;
}
.font-size-change2{
font-size:5rem;
color: #FFFF55;
}
.font-size-change3{
font-size:3rem;
}
.font-size-change4{
font-size:5rem;
} 
}  @media screen and (min-width: 992px) {
.content-box-i1{width:50%;
}
} .balloon5 {
width: 100%;
margin: 1.5em 0;
overflow: hidden;
}
.balloon5 .faceicon {
float: left;
margin-right: -90px;
width: 80px;
}
.balloon5 .faceicon img{
width: 100%;
height: auto;
border: solid 3px #ffffff;
border-radius: 50%;
}
.balloon5 .chatting {
width: 100%;
}
.says {
display: inline-block;
position: relative; 
margin: 5px 0 0 105px;
padding: 17px 13px;
border-radius: 12px;
background: #ecf7fe;
}
.says:after {
content: "";
display: inline-block;
position: absolute;
top: 18px; 
left: -24px;
border: 12px solid transparent;
border-right: 12px solid #ecf7fe;
}
.says p {
margin: 0;
padding: 0;
} .sample_text06 {
font-weight:bold;
border-left: solid 5px #38b3f2;
border-bottom: solid 1px #38b3f2;
margin: 0 auto 50px;
padding: 5px 5px 5px 5px;
} .checkmark-green {
padding-left: 24px;
position: relative;
}
.checkmark-green:before,
.checkmark-green:after {
content: "";
display: block;
position: absolute;
}
.checkmark-green:before {
width: 16px;
height: 16px;
border-radius: 3px;
background: #03CC00;
border: 1px solid #03CC00;
left: 0;
top: 50%;
transform: translateY(-50%);
}
.checkmark-green:after {
border-left: 2px solid #fff;
border-bottom: 2px solid #fff;
width: 6px;
height: 3px;
left: 5px;
top: 50%;
transform: translateY(-50%) rotate(-45deg);
-webkit-transform: translateY(-50%) rotate(-45deg);
} .collum-cover{
border: 2px solid #0693e3;
border-radius: 3px;
}
.box-011 {
position: relative;  padding: 0em 1.5em 2em 1.5em; }
.tag {
position: absolute;
top: -1.9em;
left: -2px;
padding: .2em .8em;
border-radius: 5px 5px 0 0;
background-color: #0693e3;
color: #fff;
}
.box-011-title{ 
font-size:1.5rem; 
color:#0693e3;
}
.box-011 p {
margin: 0;
color: #333;
}
@media screen and (max-width: 575.98px) {
.check-img{
width:50px;
position: absolute;
top:0px; 
right:-20px;
z-index:1;
}
} @media screen and (min-width: 576px) {
.check-img{
width:50px;
position: absolute;
top:0px; 
right:-20px;
z-index:1;
}
} @media screen and (min-width: 992px) {
.check-img{
width:100px;
position: absolute;
top:0px; 
left:100%;
z-index:1;
}
}  .item-image-tag{
position: absolute;
top:15px; 
left:15px;
z-index:1;
display:inline;
}
.say-contact {
position: relative;
padding: 1rem 1.5rem;
font-size: 1.5rem;
font-weight: bold;
text-align: center;
}
.say-contact::before,
.say-contact::after {
position: absolute;
top: 0.8rem;
height: 3.8rem;
content: '';
}
.say-contact::before {
border-left: solid 3px;
left: 0;
transform: rotate(-30deg);
}
.say-contact::after {
border-right: solid 3px;
right: 0;
transform: rotate(30deg);
} @media screen and (max-width: 575.98px) {
.say-size{
font-size:1.75rem;
}
} @media screen and (min-width: 576px) {
.say-size{
font-size:1.75rem;
}
} @media screen and (min-width: 992px) {
.say-size{
font-size:2.5rem;
}
}
@media screen and (max-width: 575.98px) {
.tel-font-size{
font-size:2.5rem;
}
.tel-font-size2{
font-size:3.25vw;
}
.contact-image{
width:60%
}
} @media screen and (min-width: 576px) {
.tel-font-size{
font-size:2.5em;
}
.contact-image{
width:80%
}
.tel-font-size2{
font-size:1em;
}
} @media screen and (min-width: 992px) {
.tel-font-size{
font-size:3.5em;
}
.contact-image{
width:80%
}
.tel-font-size2{
font-size:1.25em;
}
}/*/*//**/ .wq-Dialog .wq-Button.wq-type-primary:not(:hover):not(:active),
.wq-Form .wq-Button.wq-type-primary:not(:hover):not(:active) {
background-color: #0693e3;
margin:0 auto;
} .wq-Dialog .wq-Button.wq-type-primary:hover,
.wq-Dialog .wq-Button.wq-type-primary:active,
.wq-Form .wq-Button.wq-type-primary:hover,
.wq-Form .wq-Button.wq-type-primary:active {
background-color:#0693e3 ;
margin:0 auto;
} .wq-Form .wq-lct-enabled>.wq--head{
background-color: #c7e3e5;
} .wq-Form .wq-Option>.wq--label>.wq--ribbon.wq-ribbon-2 {
background-color: #0693e3;
color: #fff;
} .wq-Form .wq-Checkbox, .wq-Form .wq-Radio  {
margin: 0 auto;
}
.container {
text-align: center;
} .privacy-policy {
height: 350px;
padding: 2em;
overflow-y: scroll;
border: 2px solid #111;
}
.privacy-policy__box {
margin-top: 30px;
}
.privacy-policy__box:first-child {
margin-top: 0px;
}
.privacy-policy__head {
font-size: 20px;
font-weight: 700;
}
.privacy-policy__detail {
margin-top: .5em;
}
.wrapper {
max-width: 1000px;
margin-top: 10px;
margin-left: auto;
margin-right: auto;
}
@media screen and (max-width: 1000px) {
.wrapper {
margin-right: 5%;
margin-left: 5%;
}
}
#wq-checkbox-checkbox-10-wrapper{
display:none;
}
#wq-attr-checkbox-10 .wq--label{
display:none;
} .circle_btn05 {
position: relative;
display: inline-block;
}
.circle_btn05 .circle_btn05-txt {
height: 48px;
line-height: 48px;
padding-right: 72px;
color: initial; text-decoration: none;
font-weight: bold; }
.circle_btn05 .circle_btn05-icon {
width: 48px;
height: 48px;
position: absolute;
top: 0;
right: 0;
pointer-events: none;
}
.circle_btn05 .circle_btn05-icon .circle_btn05-circle {
transition: transform 1s cubic-bezier(.23,1,.32,1);
height: 48px;
}
.circle_btn05 .circle_btn05-icon .circle_btn05-circle svg {
transition: transform .75s cubic-bezier(.215,.61,.355,1);
width: 100%;
height: 100%;
position: relative;
}
.circle_btn05 .circle_btn05-icon .circle_btn05-circle svg path {
stroke-width: 2;
transition: stroke-width .75s cubic-bezier(.215,.61,.355,1);
}
.circle_btn05 .circle_btn05-icon .circle_btn05-arrow {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
display: inline-flex;
}
.circle_btn05 .circle_btn05-icon .circle_btn05-arrow svg path {
stroke-width: 2;
stroke: #45B173; }
.circle_btn05 .circle_btn05-circle-itm {
background-color: #009fe6; height:48px;
} .circle_btn05:hover .circle_btn05-txt {
transform: translateX(-12px);
transition: transform .5s cubic-bezier(.39,.575,.565,1);
}
.circle_btn05:hover .circle_btn05-icon .circle_btn05-circle {
transform: rotate(1turn);
transition: transform .75s cubic-bezier(.23,1,.32,1);
}/*\*//**/.container {
width: 90%;
max-width: 1200px;
margin: 0 auto;
} .header {
background: #0066cc;
color: white;
padding: 20px 0;
text-align: center;
}
.header h1 {
font-size: 2rem;
margin-bottom: 10px;
}
.header p {
font-size: 1.2rem;
} .menu {
margin: 30px 0;
}
.menu h2 {
font-size: 1.8rem;
margin-bottom: 20px;
border-bottom: 2px solid #0066cc;
padding-bottom: 5px;
}
.menu-item {
background: white;
border: 1px solid #ddd;
border-radius: 5px;
padding: 20px;
margin-bottom: 20px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
.menu-item h3 {
font-size: 1.5rem;
color: #0066cc;
margin-bottom: 10px;
}
.menu-item ul {
margin-top: 10px;
}
.menu-item ul li {
margin-left: 20px;
list-style: disc;
} .cta {
background: #0066cc;
color: white;
padding: 30px;
text-align: center;
border-radius: 5px;
}
.cta h2 {
font-size: 1.8rem;
margin-bottom: 10px;
}
.cta p {
font-size: 1.2rem;
margin-bottom: 20px;
}
.btn {
display: inline-block;
padding: 10px 20px;
background: white;
color: #0066cc;
font-weight: bold;
border-radius: 5px;
border: 2px solid white;
transition: all 0.3s ease;
}
.btn:hover {
background: #004999;
color: white;
border-color: #004999;
}  .display_inline_block{
display:inline-block;
}
.midashi-paint{
width:10rem;
} .emphasis_design {
--outline : #fff;
}
.emphasis_design_black{
--outline : #000;
}
.emphasis_design {
text-shadow: var(--outline) 3px 0 0, var(--outline) 2.83487px 0.981584px 0, var(--outline) 2.35766px 1.85511px 0, var(--outline) 1.62091px 2.52441px 0, var(--outline) 0.705713px 2.91581px 0, var(--outline) -0.287171px 2.98622px 0, var(--outline) -1.24844px 2.72789px 0, var(--outline) -2.07227px 2.16926px 0, var(--outline) -2.66798px 1.37182px 0, var(--outline) -2.96998px 0.42336px 0, var(--outline) -2.94502px -0.571704px 0, var(--outline) -2.59586px -1.50383px 0, var(--outline) -1.96093px -2.27041px 0, var(--outline) -1.11013px -2.78704px 0, var(--outline) -0.137119px -2.99686px 0, var(--outline) 0.850987px -2.87677px 0, var(--outline) 1.74541px -2.43999px 0, var(--outline) 2.44769px -1.73459px 0, var(--outline) 2.88051px -0.838247px 0;
}
.emphasis_design_black {
text-shadow: var(--outline) 3px 0 0, var(--outline) 2.83487px 0.981584px 0, var(--outline) 2.35766px 1.85511px 0, var(--outline) 1.62091px 2.52441px 0, var(--outline) 0.705713px 2.91581px 0, var(--outline) -0.287171px 2.98622px 0, var(--outline) -1.24844px 2.72789px 0, var(--outline) -2.07227px 2.16926px 0, var(--outline) -2.66798px 1.37182px 0, var(--outline) -2.96998px 0.42336px 0, var(--outline) -2.94502px -0.571704px 0, var(--outline) -2.59586px -1.50383px 0, var(--outline) -1.96093px -2.27041px 0, var(--outline) -1.11013px -2.78704px 0, var(--outline) -0.137119px -2.99686px 0, var(--outline) 0.850987px -2.87677px 0, var(--outline) 1.74541px -2.43999px 0, var(--outline) 2.44769px -1.73459px 0, var(--outline) 2.88051px -0.838247px 0;
}
.emphasis_design2 {
--outline:#FFFF55;
}
.emphasis_design2 {
text-shadow: var(--outline) 3px 0 0, var(--outline) 2.83487px 0.981584px 0, var(--outline) 2.35766px 1.85511px 0, var(--outline) 1.62091px 2.52441px 0, var(--outline) 0.705713px 2.91581px 0, var(--outline) -0.287171px 2.98622px 0, var(--outline) -1.24844px 2.72789px 0, var(--outline) -2.07227px 2.16926px 0, var(--outline) -2.66798px 1.37182px 0, var(--outline) -2.96998px 0.42336px 0, var(--outline) -2.94502px -0.571704px 0, var(--outline) -2.59586px -1.50383px 0, var(--outline) -1.96093px -2.27041px 0, var(--outline) -1.11013px -2.78704px 0, var(--outline) -0.137119px -2.99686px 0, var(--outline) 0.850987px -2.87677px 0, var(--outline) 1.74541px -2.43999px 0, var(--outline) 2.44769px -1.73459px 0, var(--outline) 2.88051px -0.838247px 0;
}  @media screen and (max-width: 575.98px) {
.font-size-change{
font-size:2rem;
}
} @media screen and (min-width: 576px) {
.font-size-change{
font-size:2.25rem;
}
} @media screen and (min-width: 992px) {
.font-size-change{
font-size:3rem;
}
} .area-h{
position: relative;
background: #ffd98a;
padding: 2px 15px 2px 25px;
font-size: 20px;
color: #474747;
border-radius: 0 10px 10px 0;
}
.area-h:before {
font-family: "Font Awesome 5 Free";
content: "\f041";
display: inline-block;
line-height: 30px;
position: absolute;
padding: 0em;
color: white;
background: #ffa337;
font-weight: 900;
width: 30px;
text-align: center;
height: 30px;
line-height: 30px;
left: -1.35em;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
border: solid 3px white; 
border-radius: 50%;
} .t-image{
position: absolute;
top:0;
left: 0;
z-index:-1;
}
.t-image-mb{
position: absolute;
top:-55px;
left:-40px;
z-index:-1;
}  @media screen and (max-width: 575.98px) {
.number-1{
position: absolute;
top:-3vh;
left:0px;
z-index:-1;
font-size:15vw;
opacity:0.5;
}
} @media screen and (min-width: 576px) {
.number-1{
position: absolute;
top:-3vh;
left:0px;
z-index:-1;
font-size:15vw;
opacity:0.5;
}
} @media screen and (min-width: 992px) {
.number-1{
position: absolute;
top:-5vh;
left:0px;
z-index:-1;
font-size:10vw;
opacity:0.5;
}
} .acute-triangle-cover{  
position: relative;
}
.acute-triangle {
position: relative;
top:1px;
z-index:1;
height: 5vh;
width: 100vw;
clip-path: polygon(35% 0, 100% 100%, 0 100%);
border:solid #FAFAFA 30px;
}
.acute-triangle-blue {
position: relative;
top:1px;
z-index:1;
height: 5vh;
width: 100vw;
clip-path: polygon(50% 0, 100% 100%, 0 100%);
border:solid #0693e3 30px;
}
.acute-triangle-white {
position: relative;
z-index:10;
top: 1px;
left: 0vw;
height: 5vh;
width: 100vw;
clip-path: polygon(75% 0, 100% 100%, 0 100%);
border:solid #fff 30px;
} @media screen and (max-width: 575.98px) {
.triangle-image-1 {
position: absolute;
z-index:0;
bottom: 0px;
left: 0vw;
width:35vw;
}
} @media screen and (min-width: 576px) {
.triangle-image-1 {
position: absolute;
z-index:0;
bottom: 0px;
left: 0vw;
width:20vw;
}
} @media screen and (min-width: 992px) {
.triangle-image-1 {
position: absolute;
z-index:0;
bottom: 0px;
left: 3vw;
width:16vw;
}
}
.z-index-1{
z-index:1;
}
.z-index-100{
z-index:100;
} .triangle{
width: 0;
height: 0;
border-top: 35px solid #fff;
border-right: 40px solid transparent;
border-left: 40px solid transparent;
} @media screen and (max-width: 575.98px) {
.heading-img1{
max-width:10px;}
} @media screen and (min-width: 576px) {
.heading-img1{
max-width:15px;
}
} @media screen and (min-width: 992px) {
.heading-img1{
max-width:30px;
}
} .heading-img1{
width:20px;
} .arrow_r_b {
position: relative;
display: inline-block;
padding-left: 22px;
}
.arrow_r_b:before {
content: '';
width: 21px;
height: 21px;
background: #0693e3;
border-radius: 50%;
position: absolute;
top: 0;
left: 8px;
bottom: 0;
margin: auto;
}
.arrow_r_b:after {
content: '';
width: 6px;
height: 6px;
border: 0;
border-top: solid 2px #fff;
border-right: solid 2px #fff;
transform: rotate(45deg);
position: absolute;
top: 0;
left: 13px;
bottom: 0;
margin: auto;
}  .button-1 {
display: flex;
justify-content: center;
align-items: center;
width: 250px;
margin:0 auto;
padding: .9em 2em;
border: 2px solid #2589d0;
border-radius: 100px;
background-color: #fff;
color: #2589d0;
font-size: 1em;
}
.button-1::after {
} .heading2 {
font-size: 30px;
font-size: 3rem;
position: relative;
padding: 1.5rem;
text-align: center;
}
.heading2 span {
font-size: 18px;
font-size: 1.8rem;
display: block;
}
.heading2:before {
position: absolute;
bottom: -10px;
left: calc(50% - 30px);
width: 60px;
height: 5px;
content: '';
border-radius: 3px;
background: #0693e3;
}
.overflow-hidden{
overflow:hidden;  
} @media screen and (max-width: 575.98px) {
.workman1{
position: absolute;
z-index:10;
width: 100px;
bottom:80px;
right:-8vw;
opacity:1;
}
.workman2{
position: absolute;
z-index:10;
width: 120px;
bottom:-20px;
right:0vw;
opacity:1;
}
.staff2{
position: absolute;
z-index:10;
width: 120px;
bottom:-20px;
right:0vw;
opacity:1;
}
.car{
position: absolute;
top:0vh;
z-index:10;
width: 120px;
left:0vw;
}
} @media screen and (min-width: 576px) {
.workman1{
position: absolute;
bottom:50px;
z-index:10;
width: 100px;
right:23vw;
opacity:1;
}
.workman2{
position: absolute;
z-index:10;
width: 120px;
bottom:-20px;
right:0vw;
opacity:1;
}
.car{
position: absolute;
top:0vh;
z-index:10;
width: 80px;
left:2vw;
}
} @media screen and (min-width: 992px) {
.workman1{
position: absolute;
bottom:0px;
z-index:10;
width: 300px;
right:15vw;
opacity:1;
}
.workman2{
position: absolute;
top:35vh;
z-index:10;
width: 300px;
left:30vw;
}
.staff2{
position: absolute;
top:25vh;
z-index:10;
width: 180px;
left:30vw;
}
.car{
position: absolute;
top:10vh;
z-index:10;
width: 180px;
}
} .display-inline-block{
display:inline-block;
} .heading1{
padding: 1rem; background-image: linear-gradient(135deg, transparent 0 0px, #FFFFFF 15vw calc(100% - 15vw), transparent calc(100% - 20px)),
radial-gradient(#0693e3 30%, transparent 30%);
background-repeat: no-repeat, repeat;
background-size: 100% 100%, 10px 10px;
} @media screen and (max-width: 575.98px) {
.about-content-width
{
width:90vw;
}} @media screen and (min-width: 992px) {
.about-content-width
{
width:40vw;
}
} @media screen and (max-width: 575.98px) {
.staff-img-width
{
width:70%;
}} @media screen and (min-width: 992px) {
.staff-img-width
{
width:350px;
}
} .heading5 {
position: relative;
padding: 1.5rem 2rem;
border-radius: 10px;
background: #0693e3;
display:inline-block;
}
.heading5:after {
position: absolute;
bottom: -9px;
left: 50%;
width: 0;
height: 0;
content: '';
border-width: 10px 10px 0 10px;
border-style: solid;
border-color: #0693e3 transparent transparent transparent;
} .emphasis01{
display: inline-block;
position: relative;
}
.emphasis01::before{
position: absolute;
top: -0.7em;
left: 50%;
transform: translate(-50%, 0);
color: #009FE6 ;
font-size: 1em;
content: "・";
}  @media screen and (min-width: 992px) {
.subsidy-cover{
width:50vw;
}
.subsidy-cover2{
width:60vw;
}
.subsidy{
width:100%;
position:absolute;
bottom:0px;
}
} .subsidy-heading1{
background: #bdf9c6;
padding: 1rem 1rem 1rem 2.5rem;
position: relative;
}
.subsidy-heading1:before {
position: absolute;
top: 20%;
left: 20px;
width: 6px;
height: 60%;
content: '';
border-radius: 3px;
background: #00926b;
}
.subsidy-heading2{
background: #f5f4bc;
padding: 1rem 1rem 1rem 2.5rem;
position: relative;
}
.subsidy-heading2:before {
position: absolute;
top: 20%;
left: 20px;
width: 6px;
height: 60%;
content: '';
border-radius: 3px;
background: #fcb900;
}
.subsidy-heading3{
background: #eaf5f9;
padding: 1rem 1rem 1rem 2.5rem;
position: relative;
}
.subsidy-heading3:before {
position: absolute;
top: 20%;
left: 20px;
width: 6px;
height: 60%;
content: '';
border-radius: 3px;
background: #27acd9;
}
.subsidy-heading4{
background: #fbdec9;
padding: 1rem 1rem 1rem 2.5rem;
position: relative;
}
.subsidy-heading4:before {
position: absolute;
top: 20%;
left: 20px;
width: 6px;
height: 60%;
content: '';
border-radius: 3px;
background: #ff6900;
}
.subsidy-heading5{
background: #fff;
padding: 1rem 1rem 1rem 1rem;
position: relative;
}
.subsidy-heading5:before {
position: absolute;
top: 20%;
left: 0px;
width: 6px;
height: 60%;
content: '';
border-radius: 3px;
background: #0693e3;
}
.subsidy-heading6{
background: #fff;
padding: 1rem 1rem 1rem 1rem;
position: relative;
}
.subsidy-heading6:before {
position: absolute;
top: 20%;
left: 0px;
width: 6px;
height: 60%;
content: '';
border-radius: 3px;
background: #00926b;
} .pic-container {
display: flex;
justify-content: center;
flex-direction: column;
box-sizing: border-box;
background-color: #fefefe;
}
.pic-contents {
position: relative;
padding-bottom: 0.5rem;
border-bottom: 3px solid #333;
background-color: white;
color: #333;
font-weight: bold;
font-size: 26px;
text-align: center;
}
.pic-contents:before {
position: absolute;
top: 100%;
left: 50%;
transform: translateX(-50%) skew(-25deg);
height: 20px;
width: 10px;
border-right: 3px solid #333;
background-color: white;
content: "";
}
@media screen and (min-width: 992px) {
.pic-text-box{
padding: 0 20vw;
}
} .plan1{
position:relative;
padding:20px 10px;
font-size:1.25rem;
font-weight:800;
border:2px solid #325A8C; 
border-radius:10px;
}
.plan1::after{
content: "おすすめプラン1";
position: absolute;
top: -14px;
left: 10px;
background: #fff;
font-size: 1rem;
} .plan2{
position:relative;
padding:20px 10px;
font-size:1.25rem;
font-weight:800;
border:2px solid #325A8C; 
border-radius:10px;
}
.plan2::after{
content: "おすすめプラン２";
position: absolute;
top: -14px;
left: 10px;
background: #fff;
font-size: 1rem;
} .plan3{
position:relative;
padding:20px 10px;
font-size:1.25rem;
font-weight:800;
border:2px solid #325A8C; 
border-radius:10px;
}
.plan3::after{
content: "おすすめプラン３";
position: absolute;
top: -14px;
left: 10px;
background: #fff;
font-size: 1rem;
} @media screen and (max-width: 575.98px) {
.news-slider-width{
width:90vw;
}
} @media screen and (min-width: 576px) {
.news-slider-width{
width:90vw;
}
} @media screen and (min-width: 992px) {
.news-slider-width{
width:60vw;
}
} .heading3{
position: relative;
padding-left: 35px;
}
.heading3:before {
position: absolute;
font-family: "Font Awesome 5 Free";
content: "\f0eb";
background: #ffca2c;
color: white;
font-weight: 900;
font-size: 15px;
border-radius: 50%;
left: 0;
width: 25px;
height: 25px;
line-height: 25px;
text-align: center;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.heading3:after { content: '';
display: block;
position: absolute;
left: 20px;
height: 0;
width: 0;
border-top: 7px solid transparent;
border-bottom: 7px solid transparent;
border-left: 12px solid #ffca2c;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
} .about-title-h {
position: relative;
color: #158b2b;
font-size: 20px;
padding: 10px 0;
text-align: center;
margin: 1.5em 0;
}
.about-title-h:before {
content: "";
position: absolute;
top: -8px;
left: 50%;
width: 150px;
height: 78px;
border-radius: 50%;
border: 5px solid #a6ddb0;
border-left-color: transparent;
border-right-color: transparent;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
} .h-border {
border-bottom: solid 3px #cce4ff;
position: relative;
}
.h-border:after {
position: absolute;
content: " ";
display: block;
border-bottom: solid 3px #5472cd;
bottom: -3px;
width: 20%;
} .staff-image{
position: relative;
z-index:2;
} @media screen and (max-width: 575.98px) { .staff-onepoint{
position:absolute;
width:130px;
height:100%;
z-index:1;
top:0;
left:0vw;
} .staff-onepoint2{
position:absolute;
width:130px;
height:100%;
z-index:1;
top:0;
right:0vw;
} .staff-onepoint3{
position:absolute;
width:170px;
height:100%;
z-index:0;
top:0;
left:0vw;
} .staff-onepoint4{
position:absolute;
width:170px;
height:100%;
z-index:0;
top:0;
right:0vw;
}
.staff-onepoint5{
position:absolute;
width:170px;
height:100%;
z-index:0;
top:0;
left:0vw;
}
} @media screen and (min-width: 576px) { .staff-onepoint{
position:absolute;
width:130px;
height:100%;
z-index:1;
top:0;
left:0vw;
} .staff-onepoint2{
position:absolute;
width:130px;
height:100%;
z-index:1;
top:0;
right:0vw;
} .staff-onepoint3{
position:absolute;
width:170px;
height:100%;
z-index:0;
top:0;
left:0vw;
} .staff-onepoint4{
position:absolute;
width:170px;
height:100%;
z-index:0;
top:0;
right:0vw;
}
.staff-onepoint5{
position:absolute;
width:170px;
height:100%;
z-index:0;
top:0;
left:0vw;
}
} @media screen and (min-width: 992px) { .staff-onepoint{
position:absolute;
width:50px;
height:100%;
z-index:1;
top:0;
left:0vw;
} .staff-onepoint2{
position:absolute;
width:50px;
height:100%;
z-index:1;
top:0;
right:0vw;
} .staff-onepoint3{
position:absolute;
width:200px;
height:100%;
z-index:0;
top:0;
left:0vw;
}
.staff-onepoint4{
position:absolute;
width:200px;
height:100%;
z-index:0;
top:0;
right:0vw;
}
.staff-onepoint5{
position:absolute;
width:170px;
height:100%;
z-index:0;
top:0;
left:0vw;
}
} .container_01 {
height: 300px;
z-index: 999;
position: absolute;
right: 5vw;
bottom: 30vh;
}
.scrollbar-text_01 {
display: inline-block;
position: absolute;
bottom: 0;
padding: 10px 10px 110px;
color: #abb8c3;
font-size: 14px;
line-height: 1;
letter-spacing: 0.2em;
text-transform: uppercase;
writing-mode: vertical-lr;
left: 50%;
transform: translateX(-50%);
}
.scrollbar_01 {
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: 1px;
}
.scrollbar_01::after {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 1px;
height: 100px;
background: #abb8c3;
}
.scrollbar_01::before {
content: "";
position: absolute;
bottom: 0;
left: -4px;
width: 8px;
height: 8px;
border-radius: 50%;
background: #64aa44;
animation: circlemove 3s ease-in-out infinite,
cirlemovehide 3s ease-out infinite;
z-index:1;
}
@keyframes circlemove {
0% {
bottom: 95px;
}
100% {
bottom: 0px;
}
}
@keyframes cirlemovehide {
0% {
opacity: 0;
}
50% {
opacity: 1;
}
80% {
opacity: 0.9;
}
100% {
opacity: 0;
}
}  .scrollbar-text_04 {
display: inline-block;
position: absolute;
bottom: 0;
padding: 10px 10px 110px;
color: #abb8c3;
font-size: 14px;
line-height: 1;
letter-spacing: 0.2em;
text-transform: uppercase;
writing-mode: vertical-lr;
left: 50%;
transform: translateX(-50%);
}
.scrollbar_04 {
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: 1px;
}
.scrollbar_04::after {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 1px;
height: 100px;
background: #abb8c3;
}
.scrollbar_04::before {
content: "";
position: absolute;
bottom: 0;
left: -4px;
width: 8px;
height: 8px;
border-radius: 50%;
background: #64aa44;
animation: circlemove 3s ease-in-out infinite,
cirlemovehide 3s ease-out infinite;
z-index:1;
}
@keyframes circlemove {
0% {
bottom: 95px;
}
100% {
bottom: 0px;
}
}
@keyframes cirlemovehide {
0% {
opacity: 0;
}
50% {
opacity: 1;
}
80% {
opacity: 0.9;
}
100% {
opacity: 0;
}
}
@media screen and (max-width: 575.98px) {
.container_04 {
height: 300px;
z-index: 999;
position: absolute;
right: 5vw;
top: 30vh;
}
} @media screen and (min-width: 576px) {
.container_04 {
height: 300px;
z-index: 999;
position: absolute;
right: 5vw;
top: 30vh;
}
} @media screen and (min-width: 992px) {
.container_04 {
height: 300px;
z-index: 999;
position: absolute;
right: 5vw;
top: 30vh;
}
} .top-slider-contents1{
position: absolute;
left: 5vw;
top: 30vh;
z-index: 999;
}   .staff-image-triangle{
position: absolute;
left:0;
top:0;
z-index: 1;
height: 0; width: 0;
border: solid;
border-color: rgba(0, 0, 0, 0);
border-top-color: #fff;
border-width: 50px 50px 0px 0px;
}
.staff-image-triangle2{
position: absolute;
right:0;
bottom:0;
z-index: 1;
height: 0; width: 0;
border: solid;
border-color: rgba(0, 0, 0, 0);
border-right-color: #0693e3;
border-width: 50px 50px 0px 0px;
}
.dli-chevron-right {
position: absolute;
right:10px;
bottom:10px;
z-index: 2;
display: inline-block;
vertical-align: middle;
color: #fff;
line-height: 1;
width: 10px;
height: 10px;
border: 2px solid currentColor;
border-left: 0;
border-bottom: 0;
box-sizing: border-box;
transform: translateX(-25%) rotate(45deg);
} .dli-arrow-right {
display: inline-block;
vertical-align: middle;
color: #0693e3;
line-height: 1;
position: absolute;
right:10px;
width: 1em;
height: 0.1em;
background: currentColor;
}
.dli-arrow-right::before {
content: '';
width: 0.65em;
height: 0.65em;
border: 0.1em solid #0693e3;
border-left: 0;
border-bottom: 0;
transform: rotate(45deg);
transform-origin: top right;
position: absolute;
top: 50%;
right: -0.05em;
box-sizing: border-box;
} .dli-caret-right {
position: absolute;
right:10px;
display: inline-block;
vertical-align: middle;
color: #333;
line-height: 1;
width: 0;
height: 0;
border-style: solid;
border-color: transparent;
border-width: 0.375em 0.64952em;
border-left-color: #00a2ff;
border-right: 0;
}
.margin-0-auto{
margin:0 auto;
} @media screen and (max-width: 575.98px) {
.menu-image { width: 40px; }
.menu-width {
width: 90%;
position: relative;
left: 5vw;
}
} @media screen and (min-width: 576px) and (max-width: 991.98px) {
.menu-image { width: 70px; }
.menu-width { 
width: 90vw;
left: 5vw; 
} } @media screen and (min-width: 992px) {
.menu-image { width: 70px; }
.menu-width {
width: 80vw;
position: relative;
left: 10vw; 
}
}   @media screen and (max-width: 575.98px) {
.top-slider-contents11 {
position: absolute;
top: 2vh;
left: 2.5vw;
z-index: 999;
}
.participating-store-cover {
position: absolute;
}
.home-h1 {
text-align: start;
}
.sub-phrase1 {
font-size: 5vw;
}
.sub-phrase2 {
font-size: 1rem;
}
.top-slider-sub-text { }
.h1-font-1 {
   font-size:5.5vw;
text-align:center;
 
}
.h1-font-2 {
font-size: 14vw;
color: #0693e3;
}
.h1-font-3 {
font-size: 14vw;
}
.h1-font-4 {
font-size: 8vw;
}
.toto-width {
min-width: 75vw;
}
.toto-image-width {
width: 30vw;
}
.toto-h {
font-size: 1rem;
}
} @media screen and (min-width: 576px) and (max-width: 991.98px) {
.top-slider-contents11 {
position: absolute;
top: 2vh;
left: 2.5vw;
z-index: 999;
}
.top-content-cover {
position: relative;
top: 2vh;
}
.participating-store-cover {
position: absolute;
top: 55vh;
left: 8vw;
z-index: 999;
}
.home-h1 {
text-align: start;
}
.sub-phrase1 {
font-size: 4vw;
}
.sub-phrase2 {
font-size: 1rem;
}
.top-slider-sub-text {
text-align: center;
}
.h1-font-1 {
font-size: 3.5vw;
text-align:center;
}
.h1-font-2 {
font-size: 11vw;
color:  #0693e3;
}
.h1-font-3 {
font-size: 9vw;
}
.h1-font-4 {
font-size: 9vw;
}
.toto-width {
min-width: 45vw;
}
.toto-image-width {
max-width: 30vw;
}
.toto-h {
font-size: 1rem;
}
} @media screen and (min-width: 992px) {
.top-slider-contents11 {
position: absolute;
flex-direction: unset;
top: 2vh;
left: 5vw;
z-index: 999;
}
.top-content-cover {
position: relative;
}
.participating-store-cover {
position: relative;
top: 0vh;
left: 0vw;
z-index: 999;
}
.home-h1 {
text-align: left;
position: relative;
left: 0vw;
}
.sub-phrase1 {
font-size: 2vw;
}
.sub-phrase2 {
font-size: 1.25rem;
}
.top-slider-sub-text {
width: 33vw;
position: relative;
text-align: left;
}
.h1-font-1 {
font-size: 2.5vw;
text-align:center;
}
.h1-font-2 {
font-size: 6vw;
color:  #0693e3;
}
.h1-font-3 {
font-size: 6vw;
}
.h1-font-4 {
font-size: 3.5vw;
}
.toto-image-width {
   width: 80px;
}
}
.original-text-shadow {
margin: 1rem;
text-shadow: 0px 4px 1px #fff,
1px 3px 1px #fff,
2px 3px 1px #fff,
2px 2px 1px #fff,
3px 2px 1px #fff,
3px 1px 1px #fff,
4px 0px 1px #fff,
3px -1px 1px #fff,
3px -2px 1px #fff,
2px -2px 1px #fff,
2px -3px 1px #fff,
1px -3px 1px #fff,
0px -4px 1px #fff,
-1px -3px 1px #fff,
-2px -3px 1px #fff,
-2px -2px 1px #fff,
-3px -2px 1px #fff,
-3px -1px 1px #fff,
-4px 0px 1px #fff,
-3px 1px 1px #fff,
-3px 2px 1px #fff,
-2px 2px 1px #fff,
-2px 3px 1px #fff,
-1px 3px 1px #fff;
}
.original-text-shadow2 {
margin: 1rem;
filter: drop-shadow(0 0 3px white)
drop-shadow(0 0 3px white)
drop-shadow(0 0 3px white)
drop-shadow(0 0 3px white);
}
.outlined-text-strong {
text-shadow: 0 0 3px rgba(255,255,255,.85), 2px  0   0 rgba(255,255,255,.95),
-2px  0   0 rgba(255,255,255,.95),
0    2px 0 rgba(255,255,255,.95),
0   -2px 0 rgba(255,255,255,.95),
2px  2px 0 rgba(255,255,255,.95),
-2px  2px 0 rgba(255,255,255,.95);
}
.outlined-text-thick { text-shadow: -4px -4px 0 white, -4px -3px 0 white, -4px -2px 0 white, -4px -1px 0 white, -4px 0px 0 white, -4px 1px 0 white, -4px 2px 0 white, -4px 3px 0 white, -4px 4px 0 white, -3px -4px 0 white, -2px -4px 0 white, -1px -4px 0 white, 0px -4px 0 white, 1px -4px 0 white, 2px -4px 0 white, 3px -4px 0 white, 4px -4px 0 white, 4px -3px 0 white, 4px -2px 0 white, 4px -1px 0 white, 4px 0px 0 white, 4px 1px 0 white, 4px 2px 0 white, 4px 3px 0 white, 4px 4px 0 white, 3px 4px 0 white, 2px 4px 0 white, 1px 4px 0 white, 0px 4px 0 white, -1px 4px 0 white, -2px 4px 0 white, -3px 4px 0 white, -4px 4px 0 white; } .outlined-text-bright-yellow {
color: #000; text-shadow:
-4px -4px 0 #FFFF00,
-4px -3px 0 #FFFF00,
-4px -2px 0 #FFFF00,
-4px -1px 0 #FFFF00,
-4px  0px 0 #FFFF00,
-4px  1px 0 #FFFF00,
-4px  2px 0 #FFFF00,
-4px  3px 0 #FFFF00,
-4px  4px 0 #FFFF00,
-3px -4px 0 #FFFF00,
-2px -4px 0 #FFFF00,
-1px -4px 0 #FFFF00,
0px -4px 0 #FFFF00,
1px -4px 0 #FFFF00,
2px -4px 0 #FFFF00,
3px -4px 0 #FFFF00,
4px -4px 0 #FFFF00,
4px -3px 0 #FFFF00,
4px -2px 0 #FFFF00,
4px -1px 0 #FFFF00,
4px  0px 0 #FFFF00,
4px  1px 0 #FFFF00,
4px  2px 0 #FFFF00,
4px  3px 0 #FFFF00,
4px  4px 0 #FFFF00,
3px  4px 0 #FFFF00,
2px  4px 0 #FFFF00,
1px  4px 0 #FFFF00,
0px  4px 0 #FFFF00,
-1px  4px 0 #FFFF00,
-2px  4px 0 #FFFF00,
-3px  4px 0 #FFFF00,
-4px  4px 0 #FFFF00;
} @media screen and (max-width: 575.98px) {
.say-worries {
font-size:8vw;
position: relative;
padding: 1rem 1.5rem;
text-align: center;
}
.say-worries2 {
font-size:8vw;
position: relative;
padding: 1rem 0rem;
text-align: center;
}
.resuponshibu-font1{
font-size:5vw;
}
.resuponshibu-font2{
font-size:8vw;
}
.worries-content-width{
width:80vw;
}
} @media screen and (min-width: 576px) {
.say-worries {
font-size:3vw;
position: relative;
padding: 1rem 1.5rem;
text-align: center;
}
.say-worries2 {
font-size:3vw;
position: relative;
padding: 1rem 0rem;
text-align: center;
}
.resuponshibu-font1{
font-size:5vw;
}
.resuponshibu-font2{
font-size:7vw;
}
.worries-content-width{
width:90vw;
}
} @media screen and (min-width: 992px) {
.worries-width{
width:55vw;
}
.say-worries {
font-size:3vw;
position: relative;
padding: 1rem 1.5rem;
text-align: center;
}
.say-worries2 {
font-size:3vw;
position: relative;
padding: 1rem 0rem;
text-align: center;
}
.resuponshibu-font1{
font-size:3vw;
}
.resuponshibu-font2{
font-size:4vw;
}
.worries-content-width{
width:60vw;
}
} .triangle-worries{
width: 0;
height: 0;
border-top: 35px solid #F4F4F4;
border-right: 40px solid transparent;
border-left: 40px solid transparent;
} @media screen and (max-width: 575.98px) {
.reason-width{
width:80%
}
} @media screen and (min-width: 576px) {
} @media screen and (min-width: 992px) {
.reason-width{
width:100%
}
} @media screen and (min-width: 992px) {
.cover-watashitatinituite3{ position: relative;
left: 7.5vw;
}
}
arrow {
position: absolute;
display: inline-block;
width: 11px; height: 20.67px; z-index: 3;
left: 90%;
top: 90%;
}
.arrow::before,
.arrow::after {
content: "";
position: absolute;
top: calc(50% - 0.67px); right: 0;
width: 15px; height: 1.33px; border-radius: 9999px;
background-color: #0693e3;
transform-origin: calc(100% - 0.67px) 50%; }
.arrow::before {
transform: rotate(45deg);
}
.arrow::after {
transform: rotate(-45deg);
}
.rotate-text {
position:absolute;
top:0;
left:0;
font-size:5vh;
 transform: rotate(90deg);
transform-origin: left top;
white-space: nowrap;
} @media screen and (max-width: 575.98px) {
.vertical-text {
font-size: 22vw; left: 14vw; position: absolute;
bottom: 0;
transform: rotate(-90deg); transform-origin: left bottom; white-space: nowrap; max-width: 90vh; z-index: -10;
}
} @media screen and (min-width: 576px) {
.vertical-text {
font-size: 22vw; left: 5vw; position: absolute;
bottom: 0;
transform: rotate(-90deg); transform-origin: left bottom; white-space: nowrap; max-width: 90vh; z-index: -10;
}
} @media screen and (min-width: 992px) {
.vertical-text {
font-size:10vw;
 left: 5vw;   position: absolute;
bottom: 0; transform: rotate(-90deg); transform-origin: left bottom; white-space: nowrap; z-index:-10;
}
}
.example-heading2{
position: relative;
padding: .5em 1.2em;
color: #333333;
}
.example-heading2::before,
.example-heading2::after {
display: inline-block;
position: absolute;
transform: translateY(-50%);
width: 12px;
height: 12px;
border: 2px solid #2589d0;
content: '';
}
.example-heading2::before {
top: calc(50% - 3px);
left: 0;
}
.example-heading2::after {
top: calc(50% + 3px);
left: 5px;
} .cp_list {
padding:0.5em;
list-style-type:none;
}
.cp_list li {
position:relative;
padding: 0em 0.3em 0.3em 1.3em;
}
.cp_list li:before {
position:absolute;
content:'';
top: 0.5em;
left: 0.2em;
border-style: solid;
border-width: 6px 0 6px 9px;
border-color: transparent transparent transparent #0693e3;
}
.example-ul li{
color: #616371; font-size: 16px; display: block;
position: relative;
padding: 6px 32px; }
.example-ul li:before {
font-family: FontAwesome;
font-weight: 900; font-size: 25px; color: #1c6db0; left: 0;
top: 0;
content:"\f14a";
position: absolute;
}
.check-ul {
list-style-type: none;
}
.check-ul li {
position: relative;
}
.check-ul li::after {
content: '';
display: block;
position: absolute;
top: .5em;
left: -1.5em;
width: 10px;
height: 5px;
border-left: 2px solid #25AF01;
border-bottom: 2px solid #25AF01;
transform: rotate(-45deg);
}
.example-menu-cover{
position:absolute;
top:0;
left:0;}
.warranty-h3{
display:flex;
align-items:center;
justify-content:center;
width: 100px;
height: 100px;
border-style: dotted;
border-bottom-width: 4px;
}
.balloon1 {
position: relative;
display: inline-block;
margin: 1.5em 0;
padding: 7px 10px;
min-width: 120px;
max-width: 100%;
color: #555;
font-size: 16px;
background: #fff396;
min-height:70px;
width: 100%;
}
.balloon1:before {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -15px;
border: 15px solid transparent;
border-top: 15px solid #fff396;
}
.balloon1 p {
margin: 0;
padding: 0;
} .heading_02 {
font-weight:bold;
border-left: solid 5px #38b3f2;
border-bottom: solid 1px #38b3f2;
margin: 0 auto 50px;
padding: 5px 5px 5px 5px;
}
.check-box-ul {
list-style-type: none;
}
.check-box-ul li {
position: relative;
}
.check-box-ul::after {
content: '';
display: block;
position: absolute;
top: .5em;
left: -1.5em;
width: 10px;
height: 5px;
border-left: 2px solid #25AF01;
border-bottom: 2px solid #25AF01;
transform: rotate(-45deg);
}
.checkmark-blue {
padding-left: 24px;
position: relative;
}
.checkmark-blue::before,
.checkmark-blue::after {
content: "";
display: block;
position: absolute;
}
.checkmark-blue::before {
width: 16px;
height: 16px;
border-radius: 3px;
background: #0693e3;
border: 1px solid #0693e3;
left: 0;
top: 50%;
transform: translateY(-50%);
}
.checkmark-blue::after {
border-left: 2px solid #fff;
border-bottom: 2px solid #fff;
width: 6px;
height: 3px;
transform: translateY(-50%) rotate(-45deg);
-webkit-transform: translateY(-50%) rotate(-45deg);
left: 5px;
top: 50%;
}
.checkmark-green {
padding-left: 24px;
position: relative;
}
.checkmark-green::before,
.checkmark-green::after {
content: "";
display: block;
position: absolute;
}
.checkmark-green::before {
width: 16px;
height: 16px;
border-radius: 3px;
background: #03CC00;
border: 1px solid #03CC00;
left: 0;
top: 50%;
transform: translateY(-50%);
}
.checkmark-green::after {
border-left: 2px solid #fff;
border-bottom: 2px solid #fff;
width: 6px;
height: 3px;
transform: translateY(-50%) rotate(-45deg);
-webkit-transform: translateY(-50%) rotate(-45deg);
left: 5px;
top: 50%;
}
.menu-contents-heading {
position: relative;
padding: 0.9em 2em; color: #333333;
font-size: 1.4em; }
.menu-contents-heading::before,
.menu-contents-heading::after {
display: inline-block;
position: absolute;
transform: translateY(-50%);
width: 20px; height: 20px;
border: 4px solid #00d134; content: '';
}
.menu-contents-heading::before {
top: calc(50% - 5px); left: 0;
}
.menu-contents-heading::after {
top: calc(50% + 5px); left: 9px;
}
.menu-contents-heading2 {
position: relative;
padding: .5em 0em .5em 1.2em;
color: #333333;
}
.menu-contents-heading2::before,
.menu-contents-heading2::after {
display: inline-block;
position: absolute;
transform: translateY(-50%);
width: 12px;
height: 12px;
border: 2px solid #2589d0;
content: '';
}
.menu-contents-heading2::before {
top: calc(50% - 3px);
left: 0;
}
.menu-contents-heading2::after {
top: calc(50% + 3px);
left: 5px;
} @media screen and (max-width: 575.98px) {
.menu-contents-heading2{
font-size:1.5rem; 
}
} @media screen and (min-width: 576px) {
.menu-contents-heading2{
font-size: 2rem; 
}
} @media screen and (min-width: 992px) {
.menu-contents-heading2{
font-size: 2rem; 
}
}
.heading-41 {
display: flex;
align-items: center;
padding: .5em 0  .5em .7em; background-color: #f2f2f2;
color: #333333;
}
.heading-41::before {
display: inline-block;
width: 5px;
height: 1.5em;
margin-right: .5em;
background-color: #2589d0;
content: '';
} @media screen and (max-width: 575.98px) {
.heading-41{
font-size:1.25rem; 
}
} @media screen and (min-width: 576px) {
.heading-41{
font-size: 2rem; 
}
} @media screen and (min-width: 992px) {
.heading-41{
font-size: 2rem; 
}
}
.heading-42 {
display: flex;
align-items: center;
padding: .5em 0  .5em .7em; f
background-color: #f2f2f2;
color: #333333;
}
.heading-42::before {
display: inline-block;
width: 5px;
height: 1.5em;
margin-right: .5em;
background-color: #2589d0;
content: '';
} @media screen and (max-width: 575.98px) {
.heading-42{
font-size:1.25rem; 
}
} @media screen and (min-width: 576px) {
.heading-42{
font-size: 2rem; 
}
} @media screen and (min-width: 992px) {
.heading-42{
font-size: 2rem; 
}
} @media screen and (max-width: 575.98px) {
 .responsive-heading{
font-size:1.25rem; 
}
} @media screen and (min-width: 576px) {
.responsive-heading{
font-size: 2rem; 
}
} @media screen and (min-width: 992px) {
.responsive-heading{
font-size: 2rem; 
}
}
.h2-title {
position: relative;
padding: 0 0 0 20px;
display: flex;
align-items: center;
}
.h2-title::after {
position: absolute;
content: '';
left: 0;
width: 12px;
height: 12px;
background-color: #fcb900; transform: rotate(45deg); }
.heading-33 {
border-bottom: 3px solid #f2f2f2;
}
.heading-33 span {
display: inline-block;
position: relative;
padding: 0 .4em .2em;
color: #333333;
}
.heading-33 span::before {
position: absolute;
bottom: -3px;
left: 0;
width: 100%;
height: 3px;
background-color: #2589d0;
content: '';
}
.heading-6 {
display: inline-block;
position: relative;
padding: 0 2.5em;
color: #333333;
}
.heading-6::before,
.heading-6::after {
content: '';
display: inline-block;
position: absolute;
top: 50%;
width: 45px;
height: 3px;
background-color: #2589d0;
}
.heading-6::before {
left: 0;
}
.heading-6::after {
right: 0;
}
.heading-16 {
display: flex;
justify-content: center;
align-items: center;
color: #333333;
}
.heading-16::before,
.heading-16::after {
width: 3px;
height: 40px;
background-color: #2589d0;
content: '';
}
.heading-16::before {
transform: rotate(-35deg);
margin-right: 30px;
}
.heading-16::after {
transform: rotate(35deg);
margin-left: 30px;
}
.heading-circle{
position: relative; padding-left: 1.5em; line-height: 1.4; color: black; }
.heading-circle:before {
font-family: "Font Awesome 5 Free"; content: "\f111"; font-weight: 900;
position: absolute; font-size: 1.1em; left: 2px; top: 0px; }
.heading-circle:before {
color: #2589d0;
}
.heading-square {
position: relative; padding-left: 1.5em; line-height: 1.4; color: black; }
.heading-square::before {
content: "\f0c8"; font-family: "Font Awesome 5 Free";
font-weight: 900;
position: absolute; font-size: 1.1em; left: 2px; top: 0px; color: #2589d0; }
.table-wrapper {
width: 100%;
overflow-x: hidden;
}
.comparison-table {
width: 100%;
table-layout: fixed;
border-collapse: collapse;
font-size: 14px;
text-align: center;
word-break: break-word;
}
.comparison-table th,
.comparison-table td {
border: 1px solid #ccc;
padding: 8px;
vertical-align: top;
}
.comparison-table th {
background-color: #f5f5f5;
white-space: normal;
}
.rating {
font-size: 28px;
font-weight: bold;
display: block;
margin-bottom: 4px;
line-height: 1.1;
font-family: Arial, sans-serif;
}
.excellent { color: #d9534f; }
.good      { color: #f0ad4e; }
.caution   { color: #5bc0de; }
@media screen and (max-width: 768px) {
.comparison-table {
font-size: 12px;
}
.rating {
font-size: 20px;
}
}
CSS
.list-3 {
list-style-type: none;
padding: 1em;
border: 2px solid #2589d0;
}
.list-3 li {
display: flex;
align-items: center;
gap: 0 5px;
padding: .3em;
}
.list-3 li::before {
display: inline-block;
width: 10px;
height: 5px;
border-bottom: 2px solid #2589d0;
border-left: 2px solid #2589d0;
transform: rotate(-45deg) translateY(-1.5px);
content: '';
} @media screen and (max-width: 575.98px) {
.title-padding {
padding:0 5vw;
}
} @media screen and (min-width: 576px) {
.title-padding {
padding:0 10vw;
}
} @media screen and (min-width: 992px) {
.title-padding {
padding:0 20vw;
}
} @media screen and (max-width: 575.98px) {
.reason-for-choosing {
width:60px;
}
.workman5{
width:120px; 
}
.workman6{
position:absolute;
top:40px;
    left:calc(100vw);
width:90px; 
z-index:10;
} 
.staff6{
position:absolute;
top:-0px;
    right:-25vw;
width:80px; 
z-index:10;
} 
} @media screen and (min-width: 576px) {
.reason-for-choosing {
width:80px;
}
.workman5{
position:absolute;
right:7vw;
bottom:0;
width:180px; 
}
.workman6{
position:absolute;
right:0vw;
top:0px;
width:150px;
z-index:10;
} 
} @media screen and (min-width: 992px) {
.reason-for-choosing {
width:120px;
}
.workman5{
width:260px; 
}
.workman6{
position:absolute;
right:10vw;
top:0px;
width:250px;
z-index:10;
} 
.staff6{
position:absolute;
right:5vw;
top:-93px;
width:200px;
z-index:10;
} 
}
} @media screen and (max-width: 575.98px) {
.pickup-news-image {
width:100vw;
}
} @media screen and (min-width: 576px) {
.pickup-news-image {
width:80vw;
}
} @media screen and (min-width: 992px) {
.pickup-news-image {
width:70vw;
}
}
.font-color-blue{
color:	#8FD3F4;
} @media screen and (max-width: 575.98px) {
.font-size-l{
font-size:3vw;
}
.font-size-m{
font-size:4.5vw;
}
.font-size-s{
font-size:3.5vw;
}
.toak-box-width{
width:80vw;
}
.onearea-image{
display:none;
position:absolute;
width:150px;
bottom:-180px;
right:0px;
}
.works-image-2{	
       width: 100px;
}
} @media screen and (min-width: 576px) {
.font-size-l{
font-size:3vw;
}
.font-size-m{
font-size:4vw;
}
.font-size-s{
font-size:2vw;
}
.toak-box-width{
width:70vw;
}
.onearea-image{
width:300px;
}
.works-image-2{
width: 250px;
}
} @media screen and (min-width: 992px) {
.font-size-l{
font-size:3vw;
}
.font-size-m{
font-size:3vw;
}
.font-size-s{
font-size:2vw;
} 
.toak-box-width{
width:60vw;
}
.onearea-image{
width:400px;
}
.works-image-2{
width: 350px;
}
}
.oneArea {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 200px;
} .fukidasi{
position: relative;
padding: 20px;
background-color: #FFFDED;
font-size: 16px;
 color: #000;
border-radius: 10px;
} @media screen and (max-width: 575.98px) {
.back-ground-paint{
position:absolute;
z-index:-10;
top:0%;
left:10%;
width:80vw;
}
} @media screen and (min-width: 576px) {
.back-ground-paint{
position:absolute;
z-index:-10;
top:0%;
left:20%;
width:60vw;
} .fukidasi::before{
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
border-radius: 50%;
transform: rotate(45deg);
right: -15px;
top: 22px;
border-left: 25px solid transparent;
border-top: 25px solid #FFFDED;
border-right: 25px solid transparent;
border-bottom: 25px solid transparent;
} .fukidasi::after {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
border-radius: 50%;
transform: rotate(45deg);
right: -25px;
top: 45px;
border-left: 25px solid transparent;
border-top: 25px solid #ffffff;
border-right: 25px solid transparent;
border-bottom: 25px solid transparent;
}
} @media screen and (min-width: 992px) {
.back-ground-paint{
position:absolute;
z-index:-10;
top:0%;
left:20%;
width:60vw;
} .fukidasi::before{
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
border-radius: 50%;
transform: rotate(45deg);
right: -15px;
top: 22px;
border-left: 25px solid transparent;
border-top: 25px solid #FFFDED;
border-right: 25px solid transparent;
border-bottom: 25px solid transparent;
} .fukidasi::after {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
border-radius: 50%;
transform: rotate(45deg);
right: -25px;
top: 45px;
border-left: 25px solid transparent;
border-top: 25px solid #ffffff;
border-right: 25px solid transparent;
border-bottom: 25px solid transparent;
}
}
@media screen and (max-width: 575.98px) {
.staff1{
position:absolute;
top:-70px;
right:5px;
width:180px;
} 
} @media screen and (min-width: 576px) {
.worry-man{
width:80px;
}
.staff1{
position:absolute;
right:5vw;
top:-160px;
width:310px;
z-index:10;
} 
} @media screen and (min-width: 992px) {
.staff1{
position:absolute;
top:-180px;
width:300px;
} 
}
.custom-heading {
display: flex;
justify-content: center;
align-items: flex-end;
line-height: 1;
color: #000;
overflow: visible;
}
.custom-heading::before,
.custom-heading::after {
width: 1px;
height: 53px; content: "";
background-color: #000;
}
.custom-heading::before {
margin-right: 0.7em; transform: rotate(-30deg);
}
.custom-heading::after {
margin-left: 0.7em; transform: rotate(30deg);
} @media screen and (max-width: 575.98px) {
.custom-heading::before,
.custom-heading::after {
height: 37px; }
}
.box-013 {
background-color: #fff;
max-width: 600px;
margin: 0 auto;
border: 2px solid #2589d0;
border-radius: 5px;
overflow: hidden;
} @media screen and (max-width: 767.98px) {
.box-013 {
margin: 0 1em;
}
}
.heading-013 {
display: flex;
justify-content: center;
align-items: center;
text-align: center;
padding: 0.8em 0;
background-color: #2589d0;
color: #fff;
font-weight: 600;
font-size: 1.75rem;
line-height: 1.4;
margin: 0;
min-height: 3.5em; }
.box-013 p {
margin: 0;
padding: 1.2em 1.5em;
color: #333;
font-size: 1.1em;
} @media screen and (min-width: 768px) {
.box-013 {
max-width: 800px;
}
.heading-013 {
   font-size: 1.75rem;
min-height: 4em;
}
.box-013 p {
font-size: 1.25em;
}
} @media screen and (max-width: 575.98px) {
.kp-tv-grid .wp-block-post-template .wp-block-post .wp-block-post-title {
margin: .5rem 0 0;
line-height: 1.4;
min-height: calc(1.4em * 4);
display: block;
}
.kp-tv-grid .wp-block-post-template .wp-block-post .wp-block-post-title a {
display: -webkit-box;
-webkit-line-clamp: 4;
line-clamp: 4;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}
} @media screen and (min-width: 576px) {
.kp-tv-grid .wp-block-post-template .wp-block-post .wp-block-post-title {
margin: .5rem 0 0;
line-height: 1.4;
min-height: calc(1.4em * 3);
display: block;
}
.kp-tv-grid .wp-block-post-template .wp-block-post .wp-block-post-title a {
display: -webkit-box;
-webkit-line-clamp: 3;
line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}
}
@media screen and (min-width: 768px) {
.left-padding-10vw {
padding-left: 10vw;
}
} @media screen and (max-width: 575.98px) {
.voice-heading{
position:absolute;
bottom:10px;
left:20px;
width:90px;
}} @media screen and (min-width: 576px) {
.voice-heading{
position:absolute;
bottom:0px;
left:-60px;
width:150px;
} @media screen and (min-width: 992px) {
.pc-padding-left-10 { padding-left: 10vw; }
.pc-padding-left-5 { padding-left: 5vw; }
.pc-padding-left-5plus40 { padding-left: calc(5vw + 40px); }
} @media screen and (min-width: 576px) and (max-width: 991.98px) {
.pc-padding-left-10 { padding-left: 10vw; }
.pc-padding-left-5 { padding-left: 5vw; }
.pc-padding-left-5plus40 { padding-left: calc(2.5vw); }
} .kp-affiliations{margin:24px 0}
.kp-affi-wrap{display:flex;flex-wrap:wrap;gap:10px}
.kp-affi-badge{
display:inline-flex;align-items:center;gap:.6em;
background:#fff;border:1px solid #e5eaf1;border-radius:999px;
padding:.45em .9em;box-shadow:0 4px 14px rgba(2,32,71,.06);
color:#1e293b;font-weight:700
}
.kp-affi-kicker{
font-size:.85em;font-weight:800;letter-spacing:.04em;
color:#007bbd;background:#eef7ff;border-radius:999px;padding:.15em .55em
}
.kp-affi-note{margin:.5rem 0 0;color:#64748b;font-size:.9rem}
.kp-card {
position: relative; }
.kp-badge-img {
position: absolute;
top: 30px; left: 8px; width: 30px; height: auto;
z-index: 9999;
}
@media (min-width: 769px) {
.kp-badge-img {
width: 140px; }
}
.kp-heading {
position: relative;
display: inline-block;
padding: 1rem 2rem 1rem 4rem;
color: #fff;
border-radius: 100vh 0 0 100vh;
background: #fcb900;
}
.kp-heading:before {
position: absolute;
top: calc(50% - 7px);
left: 10px;
width: 14px;
height: 14px;
content: '';
border-radius: 50%;
background: #fff;
} .kp-balloon-title {
--balloon-color: #b36b00; position: relative;
border: 3px solid var(--balloon-color);
color: #333; background: #fff;
padding: 0.6em 1em;
margin: 2em 0 1.5em;
border-radius: 6px;
} .kp-balloon-title::before,
.kp-balloon-title::after {
position: absolute;
content: '';
left: 1em;
width: 0;
height: 0;
border-width: 14px 12px 0;
border-style: solid;
}
.kp-balloon-title::before {
bottom: -14px;
border-color: var(--balloon-color) transparent transparent;
}
.kp-balloon-title::after {
bottom: -10px;
border-color: #fff transparent transparent;
} .google-bubble-wrap {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
margin: 2em auto;
text-align: center;
} .google-bubble {
display: inline-block;
position: relative;
background: #fff;
border: 2px solid #e0e0e0;
border-radius: 12px;
padding: 0.6em 1em;
box-shadow: 0 4px 10px rgba(0,0,0,0.1);
transition: all 0.3s ease;
} .google-bubble:hover {
transform: translateY(-2px);
box-shadow: 0 6px 14px rgba(0,0,0,0.15);
} .google-bubble .bubble-tail {
position: absolute;
bottom: -12px;
left: 50%;
transform: translateX(-50%);
width: 0;
height: 0;
border-style: solid;
border-width: 12px 10px 0 10px;
border-color: #fff transparent transparent transparent;
filter: drop-shadow(0 2px 1px rgba(0,0,0,0.08));
} .google-heading {
display: flex;
align-items: baseline;
justify-content: center;
gap: 0.4em;
font-family: "Noto Sans JP", "Segoe UI", Roboto, Arial, sans-serif;
font-weight: 700;
font-size: 1.8rem;
line-height: 1.2;
} .google-logo .g {
font-weight: 700;
font-size: 1.2em;
display: inline-block;
}
.g-b { color: #4285F4; }
.g-r { color: #DB4437; }
.g-y { color: #F4B400; }
.g-g { color: #0F9D58; } .google-label {
font-weight: 600;
color: #444;
} @media (max-width: 600px) {
.google-heading {
flex-wrap: wrap;
font-size: 1.6rem;
}
}
.parallelogram-title {
position: relative;
display: inline-block;
padding: 0.6em 1.5em;
background: #009fe6;
color: #fff;
font-weight: bold;
transform: skew(-20deg);
overflow: hidden;
} .parallelogram-title span {
display: inline-block;
traposition:absolute; font-size:10vw; z-index:0;nsform: skew(20deg);
}   h2.wp-block-heading.kp-hero,
h2.kp-hero{
margin: 0 !important;
padding: 0 !important;
font-weight: 900 !important;
line-height: 1.12 !important;
letter-spacing: 0.02em !important; font-size: 84px !important; color: transparent !important;
} h2.wp-block-heading.kp-hero .kp-layer,
h2.kp-hero .kp-layer{
position: relative !important;
display: inline-block !important;
} h2.wp-block-heading.kp-hero .kp-outline,
h2.kp-hero .kp-outline{
position: absolute !important;
inset: 0 !important;
z-index: 0 !important;
color: #fff !important; text-shadow:
2px 0 0 #fff, -2px 0 0 #fff,
0 2px 0 #fff, 0 -2px 0 #fff,
2px 2px 0 #fff, -2px 2px 0 #fff,
2px -2px 0 #fff, -2px -2px 0 #fff,
0 6px 18px rgba(0,0,0,.14) !important;
} h2.wp-block-heading.kp-hero .kp-fill,
h2.kp-hero .kp-fill{
position: relative !important;
z-index: 1 !important;
} h2.wp-block-heading.kp-hero .kp-black .kp-fill,
h2.kp-hero .kp-black .kp-fill{
color: #111 !important;
-webkit-text-fill-color: #111 !important;
} h2.wp-block-heading.kp-hero .kp-grad .kp-fill,
h2.kp-hero .kp-grad .kp-fill{
background: linear-gradient(to bottom, #1f4e79 0%, #2e75b6 55%, #86bfe9 100%) !important;
-webkit-background-clip: text !important;
background-clip: text !important;
-webkit-text-fill-color: transparent !important;
color: transparent !important;
} h2.wp-block-heading.kp-hero .kp-em,
h2.kp-hero .kp-em{
font-size: 1.25em !important;
line-height: 1.06 !important;
} h2.wp-block-heading.kp-hero .kp-em-black,
h2.kp-hero .kp-em-black{
font-size: 1.25em !important;
line-height: 1.06 !important;
} h2.wp-block-heading.kp-hero .kp-base,
h2.kp-hero .kp-base{
font-size: 1em !important;
letter-spacing: 0.01em !important;
}  @media (max-width: 1024px){
h2.wp-block-heading.kp-hero,
h2.kp-hero{
font-size: 64px !important;
line-height: 1.14 !important;
}
} @media (max-width: 768px){
h2.wp-block-heading.kp-hero,
h2.kp-hero{
font-size: 46px !important;
line-height: 1.15 !important;
}
h2.wp-block-heading.kp-hero .kp-outline,
h2.kp-hero .kp-outline{
text-shadow:
1.5px 0 0 #fff, -1.5px 0 0 #fff,
0 1.5px 0 #fff, 0 -1.5px 0 #fff,
1.5px 1.5px 0 #fff, -1.5px 1.5px 0 #fff,
1.5px -1.5px 0 #fff, -1.5px -1.5px 0 #fff,
0 4px 14px rgba(0,0,0,.12) !important;
}
}