@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500&display=swap');
.font1,.flow_type3 .box_title1::before{
    font-family: 'Outfit', sans-serif;
}

/*
#loading{
    display:none;
}
*/


/*--all page---------------------------
-------------------------------------*/
.linkStyle{
    color:#333;
    transition:all 0.3s;
    text-decoration:underline;
}
.linkStyle:hover{
    opacity:0.7;
}

.bg_grad{
    background: linear-gradient(90deg, rgba(229,0,18,1) 0%, rgba(245,180,152,1) 100%);
}
body{
    overflow:hidden;
}
#footer{
    background-color:#444;
}
.fix_bnr{
    left:10px;
    z-index:2;
}
.fix_bnr a{
    border-radius:50px;
    border-bottom: 5px solid #bd1824;
}
.bnr_box a{
    border-radius:20px;
    border-bottom: 5px solid #bd1824;
}
.fix_bnr a:hover,
.bnr_box a:hover{
  margin-top: 3px;
  border-bottom: 2px solid #bd1824;
}
.bnr_box .fa-phone:before{
    font-size: 0.8em;
    margin-right: 3px;
}

/*--top page---------------------------
-------------------------------------*/
#main_img{
    min-height:500px;
    max-height:800px;
    height:80vh;
}
.catch {
    top: 27%;
    right: 6%;
}
.fv_bnr{
    border-radius:30px;
    top:45%;
    right:10%;
}
.catch_sub,
.cms_title{
    font-size:5rem;
    font-weight: 500;
}
.num{
    font-size:4rem;
    font-weight: 500;
}
.s_item{
    position:absolute;
    display: inline-block;
    pointer-events:none;
}
.r1{
    animation: r1 45s linear infinite;
}
.r2{
    animation: r2 55s linear infinite;
}
.r3{
    animation: r1 60s linear infinite;
}
@keyframes r1 {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(360deg); } 
}
@keyframes r2 {
  0%   { transform: rotate(360deg); }
  100% { transform: rotate(0deg); } 
}

.s1 {
    top: 1%;
    left: -1%;
    width: min(50vw,900px);
}
.s2 {
    top: 0;
    left: -1%;
    width: min(50vw,980px);
}
.s3{
    top: 0;
    left: 0;
    width: min(50vw,1000px);
}

.s4{
    top: 60vh;
    left: -1%;
    width: min(13vw,300px);
}
.s5{
    top: 20vh;
    left: 40%;
    width: min(6vw,90px);
}
.s6{
    top: 89vh;
    left: 43%;
    width: min(4vw,80px);
}
.s7{
    top: 73vh;
    right: 6%;
    width: min(9vw,100px);
}
.s8{
    top: 79vh;
    right: 9%;
    width: min(6vw,120px);
}


.s9 {
    top: -6%;
    right: 2%;
    width: min(12vw,250px);
    z-index: 2;
}
.s10 {
    top: 4%;
    right: 1%;
    width: min(4vw,100px);
    z-index: 2;
}
.s11{
    bottom: -4%;
    left: 2%;
    width: min(8vw,500px);
}
.s12 {
    bottom: -6%;
    left: 8%;
    width: min(3vw,100px);
}


.top_cms_title .before,.top_cms_title .after,
.top_info_title .before,.top_info_title .after{
    display:none;
}


/*--under page---------------------------
-------------------------------------*/
#page_title .title_box {
    border-top: 0;
    transform: translateX(-50%);
    left: 50%;
    bottom: 60px;
    padding: 35px;
    background-color: transparent;
    color: #fff;
}
#page_title .title_box h2{
    font-size:2rem;
}

.v_type2 .demo_box {padding-top: 70px}
.v_type2 {counter-reset: number 0;}
.v_type2 .cate_box {padding: 50px 20px 30px;}
.v_type2 .cate_box:before {
    counter-increment: number 1;
    content: "0" counter(number);
    display: inline-block;
    position: absolute;
    top: -43px;
    left: -5px;
    z-index: 1;
    font-family: 'Outfit', sans-serif;
    font-size: 80px;
    font-weight: 100;
    background-color: #fff;
    line-height: 1;
    padding: 0 25px 0 0;
}


.flow_type3 .cate{counter-reset: box;}
.flow_type3 .cate_box{counter-increment: box;}
.flow_type3 .box_img1{border-radius: 50%;}
.flow_type3 .box_item{padding-top: 60px;}
.flow_type3 .box_title1{z-index: 0}
.flow_type3 .box_title1::before, .flow_type3 .box_title1::after{
	position: absolute;
	content: "";
	display: block;
	pointer-events: none
}
.flow_type3 .box_title1::before {
	content: "0"counter(box);
	font-size: 86px;
	color: #ebebeb;
	left: 0;
	top: -70px;
	z-index: -1;
	font-weight:normal;
}
.flow_type3 .box_title1::after{
	width: 100%;
	height: 1px;
	bottom: 0;
	left: 0;
	background-color: #222
}



/* ---------- responshive ---------- */
@media screen and (max-width: 1536px){

}


@media screen and (max-width: 1366px){

}


/* ---------- タブレット ---------- */
/*iPad Pro*/
@media screen and (max-width: 1024px){
.s1,.s3 {
    top: 2%;
}
.s2{
    top: 2%;
    width: min(60vw,980px);
}

.s4 {
    top: 41vh;
}
.s5{
    left: 34%;
}
.s6 {
    top: 56vh;
    left: 13%;
    width: min(9vw,80px);
}
.s7 {
    top: 82vh;
}
#main_img{
    height:800px;
}
.catch {
    top: 50%;
    width: 60vw;
}

}

@media screen and (max-width: 768px){
.s9 {
    top: -2%;
    width: min(14vw,250px);
}
.s10 {
    top: 1%;
    width: min(6vw,100px);
}
.s11 {
    bottom: -1%;
    width: min(10vw,500px);
}
.s12 {
    bottom: -2%;
    width: min(4vw,100px);
}
.catch_sub, .cms_title {
    font-size: 4rem;
}

#cms_2-g .cate_title {
    line-height: 1.5;
    font-size: 2em;
}

}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
.s1, .s3 {
    top: 1.5%;
}
.s1{
    width: min(66vw,900px);
}
.s2 {
    top: 1%;
    width: min(82vw,980px);
    left: -8%;
}
.s3{
    left: -4%;
    width: min(70vw,1000px);
}
.s4{
    width: min(26vw,300px);
}
.s5 {
    left: 48%;
    width: min(9vw,90px);
}
.s6 {
    top: 62vh;
    left: 0%;
}
.s7{
    width: min(15vw,100px);
}
.s9 {
    top: -1%;
    width: min(17vw,250px);
}
.s11 {
    bottom: -1%;
    width: min(17vw,500px);
}
.s12 {
    bottom: -2%;
    width: min(7vw,100px);
    left: 14%;
}
#main_img {
    height: 100vh;
}
.catch {
    width: 82vw;
}
.catch_sub, .cms_title {
    font-size: 3rem;
}
.catch p{
    font-size:18px;
}
#top_contents2 .con_box .text_box .before{
    left:0;
}
#page_title .title_box{
    bottom:15px;
}
#page_title .title_box h2 {
    font-size: 1.5rem;
}
.v_type2 .cate_box{padding: 42px 25px 25px;}
.v_type2 .cate_box:before{top: -31px;font-size: 48px;}

.flow_type3 .box_title1::before{
	left: auto;
	right: 0;
	top: -50px
}
.flow_type3 .box_item {
    padding-top: 36px;
}

#cms_2-g .cate_title{
    font-size: 1.5em;
}
.bnr_box a{
    width: 75%;
}
.bnr_box .bnr1{
    margin:0 auto 20px;
}
}