@charset "UTF-8";
/* ----------------------------------------------------------------------
トップページ
---------------------------------------------------------------------- */
.content{width:80%; max-width:1200px; margin:0 auto;}
.h1_wrapper,.h2_wrapper{text-align:center; padding-bottom:4rem;}
.h1_wrapper h1,.h2_wrapper h2{font-size:3.2rem; color:#023e73; font-weight:700;}
.h1_wrapper .h1_sub,.h2_wrapper .h2_sub{
  font-size:1.6rem;
  color:#5cb9f2;
  font-family: "Montserrat", sans-serif;
  font-weight: 600;
  font-style: normal;}
.flex_wrapper {display:flex; gap: 4rem; align-items: center;}
.flex_wrapper .flex_img {width: 50%; flex-shrink: 0;}
.flex_wrapper .flex_text h4{font-size:2.4rem; color:#023e73; font-weight:700; margin-bottom:2rem;}
.flex_wrapper .flex_text .br1{display:none;}
.bg_white{background-color:none; padding:12rem 0;}
.bg_blue{background-color:#f0f5ff; padding:12rem 0;}
.link_btn {margin-inline: auto; margin-top: 4rem; width: fit-content;}
.link_btn a{
    display: block;
    width:280px;
    padding: 15px 30px 15px 10px;
    text-align: center;
    color: #fff;
    font-weight: 700;
	  letter-spacing:0.1em;
    background-color: #023e73;
    border: 1px solid #023e73;
    border-radius: 10px;
    position: relative;
    font-size: 1.8rem;
}

.link_btn a::after {
    content: "";
    width: 8px;
    height: 15px;
    background-image: url(../images/arrow_white.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    position: absolute;
    top: 50%;
    right: 30px;
    translate: 0 -50%;
}
.link_btn a:hover {
    background-color: #fff;
    color: #023e73;
}

.link_btn a:hover::after {
    background-image: url(../images/arrow_blue.svg);
}

#main_img {position:relative; height: 76rem;}
#main_img .message{
	position:absolute;
	background-color:#fff;
	width:57rem;
	padding:5.5rem;
	border-radius:5rem;
	margin: 8rem 0 0 8rem;
	z-index: 0;
}
#main_img .message h2{
	font-size:5.5rem;
	line-height:1.5;
	font-weight:700;
	margin-bottom:3rem;
}
#main_img .message p{font-size:1.8rem; line-height:2;}
#main_img .slider_wrap{
	position:absolute;
    margin: 15rem 0 10rem ;
	display:flex;
	overflow: hidden;
	width:100%;
	z-index: -1;
}
#main_img .slider_inner{
	display:flex;
    list-style: none;
	animation: infinity-scroll-left 60s infinite linear 0.5s both;

}
#main_img .slider_item { width:40rem; margin-left:5rem;}
#main_img .slider_item img {width: 100%; height:auto; display:block; vertical-align: bottom;}
#main_img .slider_item.item_up img {padding-top:11rem;}

 	@keyframes infinity-scroll-left{
      from {
        transform: translateX(0);
      }
      to {
        transform: translateX(-100%);
      } 
}

/* #main_img .top_deco_wrap {position:relative;} */
#main_img .top_deco_wrap .top_deco{
	position:absolute;
	width: 188rem; 
	height:auto; 
	left: -1rem; 
	z-index: -2;
}
#main_img .top_deco_wrap .top_deco_left{
	position:absolute; 
	width: 19rem; 
	height:auto; 
	left: 15rem; 
	bottom:5rem; 
	z-index: -2;
}
#main_img .top_deco_wrap .top_deco_right{
	position:absolute; 
	width: 13rem; 
	height:auto; 
	right: 65rem; 
	bottom:8rem; 
	z-index: -2;
}

#main_content .bg_white.right1 {position:relative;}
#main_content .bg_white.right1 .deco_right1{
	position:absolute;
	width:27rem;
	height:auto;
	top:8rem;
	right:23rem;
}
#main_content .bg_blue {position:relative;}
#main_content .bg_blue .deco_left1{
	position:absolute;
	width:41.5rem;
	height:auto;
	top:-7rem;
	left:25rem;
}
#main_content .bg_white.right2 {position:relative; padding-bottom:21rem;}
#main_content .bg_white.right2 .deco_right2{
	position:absolute;
	width:28rem;
	height:auto;
	top:-4rem;
	right:28rem;
}
#main_content .bg_white.right2 .deco_bottom{
	position:absolute;
	width:130rem;
	height:auto;
	bottom:-10rem;
	right: 0;
    left: 0;
    margin: 0 auto;
}

#main_content .company_access .access_flex_wrapper{display:flex; gap:6rem; width:100%;}
#main_content .company_access .access_flex_left{width:100%;}
#main_content .company_access .access_flex_right{width:100%;}
#main_content .company_access .access_flex_wrapper iframe{width:100%;}

#main_content .company_access .access_flex_wrapper .company_name{font-size:2rem; font-weight:700; margin-bottom:1rem;}
#main_content .company_access .access_flex_wrapper p{ margin-bottom:2rem;}

@media screen and (max-width: 1600px) {
    #main_img .top_deco_wrap .top_deco_left{
		width: 14rem; 
		left: 15rem; 
		bottom:5rem; 
	}
    #main_img .top_deco_wrap .top_deco_right{
		width: 10rem; 
		bottom:6rem; 
	}
	#main_content .bg_white.right1 .deco_right1{
		width:22rem;
		right:13rem;
	}
	#main_content .bg_blue .deco_left1{
		width:30rem;
		left: 13rem;
	}

	#main_content .bg_white.right2 .deco_right2{
		width:20rem;
		right: 13rem;
	} 
	#main_content .bg_white.right2 .deco_bottom{width:120rem;}
}

@media screen and (max-width: 1366px) {
	.flex_wrapper .flex_text .br1{display:block;}
	#main_content .bg_white.right1 .deco_right1{
		width:17rem;
	}
	#main_content .bg_blue .deco_left1{
		width:25rem;
	}

	#main_content .bg_white.right2 .deco_right2{
		width:18rem;
	} 
	#main_content .bg_white.right2 .deco_bottom{width:110rem;}
}


@media screen and (max-width: 1024px) {
	.content{width:85%; }
	.bg_white,.bg_blue{ padding:8rem 0;}
	.flex_wrapper {gap: 3rem; align-items:start;}
	.flex_wrapper .flex_img {width: 40%; }
  	#main_img {height: 71rem;}
	#main_img .message {margin: 3rem 0 0 4rem; width: 45rem; padding: 4.5rem;}
	#main_img .message h2 {font-size: 4rem; margin-bottom: 3rem;}
	#main_img .slider_wrap {margin: 10rem 0 10rem;}
	#main_img .top_deco_wrap .top_deco{
		width: 170rem; 
	}
    #main_img .top_deco_wrap .top_deco_left{
		width: 14rem; 
		left: 15rem; 
		bottom:5rem; 
	}
    #main_img .top_deco_wrap .top_deco_right{
		width: 10rem; 
		bottom:6rem; 
		right:35rem;
	}
	#main_content .bg_white.right1 .deco_right1{
		width:17rem;
		right: 5rem;
		}
	#main_content .bg_blue .deco_left1{
		width:20rem;
		left: 5rem;
	}
	#main_content .bg_white.right2 .deco_right2{
		width:13rem;
		right:	 5rem;
	} 
	#main_content .bg_white.right2 .deco_bottom{
		width:90rem; 
		bottom: -4rem;
	}
}

@media screen and (max-width: 820px) {
	.flex_wrapper .flex_text .br1{display:none;}
	.h1_wrapper,.h2_wrapper {padding-bottom:3rem;}
	.h1_wrapper h1,.h2_wrapper h2{font-size:2.8rem;}
	.h1_wrapper .h1_sub,.h2_wrapper .h2_sub{font-size:1.4rem;}
	.flex_wrapper { flex-direction: column;}
	.flex_wrapper .flex_img {width: 100%; text-align: center; }
	.flex_wrapper .flex_text {margin: 0px auto; max-width:580px; }
	.flex_wrapper .flex_text h4{font-size:2rem; margin-bottom:1.5rem;}
	.flex_wrapper .flex_img.child_2{order: 1; }
	.flex_wrapper .flex_text.child_1{order: 2; }
    #main_content .company_access .access_flex_wrapper{display:block;}
    #main_content .company_access .access_flex_left{text-align:center;}
	#main_content .company_access .access_flex_right{margin-top:3rem;}
	#main_img .top_deco_wrap .top_deco{width: 170rem; }
    #main_img .top_deco_wrap .top_deco_left{
		width: 10rem; 
		left: 10rem; 
		bottom:5rem; 
	}
    #main_img .top_deco_wrap .top_deco_right{
		width: 7rem;
		right: 15rem;
	}
	#main_content .bg_white.right1 .deco_right1{top: 3rem;}
	#main_content .bg_white.right2 .deco_bottom{
	width: 70rem;
    bottom: 0rem;
	}
}

@media screen and (max-width: 768px) {
	#main_content .bg_white.right2{padding-bottom:22rem;}
	#main_content .bg_white.right2 .deco_bottom{
	width: 55rem;
    bottom: 2rem;
}
}


@media screen and (max-width: 520px) {
  	.content{width:90%; }
	.bg_white,.bg_blue{ padding:6rem 0;}
	.flex_wrapper .flex_text .br1{display:block;}
	.link_btn a {
		padding: 10px 30px 10px 10px;
		font-size: 1.6rem;
	}
	.h1_wrapper,.h2_wrapper {padding-bottom:2rem;}
  	.h1_wrapper h1,.h2_wrapper h2{font-size:2.4rem;}
	#main_img {height: 62rem;}
	#main_img .slider_wrap {margin: 27rem 0 10rem;}
	#main_img .slider_item {
    width: 26rem;
    margin-left: 1rem;
	}
	#main_img .slider_item.item_up img {
    padding-top: 2rem;
    }
	#main_img .message {
    background-color: transparent;
    width:90%;
	text-align:center;
    top:6rem;
	right: 0;
    left: 0;
    margin: 0 auto;
	padding:0rem;
    }
	#main_img .message h2 {	font-size:3.6rem; line-height:1.3; margin-bottom: 1rem;}
	#main_img .message p { font-size: 1.6rem; line-height: 1.75;}
	#main_img .top_deco_wrap .top_deco {
	width:90%;
	right: 0;
    left: 0;
    margin: 0 auto;	
	}
	#main_img .top_deco_wrap .top_deco_left{
    width: 5rem;
    left: 2rem;
    bottom: 37rem;
    transform: scaleX(-1);
	}
    #main_img .top_deco_wrap .top_deco_right{
	    width: 3rem;
        right: 2rem;
        bottom: 38rem;
	}
	#main_content .bg_white.right1 .deco_right1{width: 10rem; right: 2rem;} 
	#main_content .bg_blue .deco_left1{width: 15rem; left: 2rem; top:-2rem;}
	#main_content .bg_white.right2 .deco_right2{width: 10rem; right: 2rem; top:-2rem;} 
    #main_content .bg_white.right2{padding-bottom:30rem;}
    #main_content .bg_white.right2 .deco_bottom{
    width: 90%;
    bottom: 13rem;
}
}

@media screen and (max-width: 414px) {
	#main_content .bg_white.right1 .deco_right1{width: 8rem;} 
	#main_content .bg_blue .deco_left1{width: 12rem; left: 2rem;}
	#main_content .bg_white.right2 .deco_right2{width: 10rem; right: 2rem;} 
    #main_content .bg_white.right2{padding-bottom:28rem;}
    #main_content .bg_white.right2 .deco_bottom{
    width: 90%;
    bottom: 14rem;
}

}