@charset "utf-8";

/*========================

top.css

========================*/

/*---------------------------------------------
main_visual
---------------------------------------------*/
.index #top_main_visual {
 background-image:url(/wp-content/themes/royalagriacademy/img/top/bg.webp);
 background-repeat:no-repeat;
 background-position:center center;
 background-size:contain;
 display: flex;
 flex-direction: column;
 overflow: hidden;
 padding: 0;
 position:relative;
 z-index:1;
}

.index #top_main_visual #main_visual_cont {
 align-items:center;
 align-content:center;
 display:flex;
 flex:1;
 justify-content:center;
 position: relative;
 height:100%;
 min-height:800px;
 width:100%;
}

.index #top_main_visual #main_visual_cont.lazyloaded {
 opacity:1;
}

.index #top_main_visual #main_visual_cont .main_visual_slider {
 height:100%;
 width:100%;
 position:absolute;
 z-index:3;
}

.index #top_main_visual .main_visual_slider .mv_slide {
 height:100%;
 width:100%;
 position:relative;
 overflow:hidden;
} 

.index #top_main_visual #main_visual_cont .figure_group {
 height:100%;
 width:100%;
 position:absolute;
 inset: 0;
}

.index #top_main_visual .figure_group figure {
 position: absolute;
 inset: 0;
 width: 100vw;
 height: 100%;
 background-repeat: no-repeat;
 background-position: center center;
 background-size: contain;
 opacity: 0;
 transform: translate3d(0, 16px, 0) scale(0.92);
 transform-origin: center top;
 transition: opacity 2s ease, transform 2s cubic-bezier(0.3, 0.93, 0.58, 1);
 transition-delay: var(--d, 0s);
 will-change: opacity, transform;
 pointer-events: none;
}

.index #top_main_visual #main_visual_cont .figure_group.pc .left_figure01 {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/figure01_left.webp);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .right_figure01 {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/figure01_right.webp);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .left_figure02 {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/figure02_left.webp);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .right_figure02 {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/figure02_right.webp);
}
 
.index #top_main_visual #main_visual_cont .figure_group.pc .left_figure03 {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/figure03_left.webp);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .right_figure03 {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/figure03_right.webp);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .illust_01_01 {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/illust_01_01.png);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .illust_01_02 {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/illust_01_02.png);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .illust_01_03 {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/illust_01_03.png);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .illust_01_04 {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/illust_01_04.png);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .illust_01_05 {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/illust_01_05.png);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .illust_01_06 {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/illust_01_06.png);
}
 
.index #top_main_visual #main_visual_cont .figure_group.pc .illust_01_07 {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/illust_01_07.png);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .illust_02_01 {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/illust_02_01.png);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .illust_02_02 {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/illust_02_02.png);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .illust_02_03 {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/illust_02_03.png);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .illust_02_04 {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/illust_02_04.png);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .illust_02_05 {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/illust_02_05.png);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .illust_03_01 {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/illust_03_01.png);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .illust_03_02 {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/illust_03_02.png);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .illust_03_03 {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/illust_03_03.png);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .illust_03_04 {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/illust_03_04.png);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .t_work {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/t_work.webp);
	transform-origin: center center;
}
 
.index #top_main_visual #main_visual_cont .figure_group.pc .t_learn {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/t_learn.webp);
	transform-origin: center center;
}

.index #top_main_visual #main_visual_cont .figure_group.pc .t_experience {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/t_experience.webp);
	transform-origin: center center;
}
 
.index #top_main_visual #main_visual_cont .figure_group.pc .cloud_left_top {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/cloud_left_top.png);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .cloud_left_bottom {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/cloud_left_bottom.png);
}
 
.index #top_main_visual #main_visual_cont .figure_group.pc .cloud_right_top {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/cloud_right_top.png);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .cloud_right_bottom {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/cloud_right_bottom.png);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .bird_left {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/bird_left_top.webp);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .bird_right {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/bird_right_top.webp);
}

.index #top_main_visual #main_visual_cont .figure_group.pc .service_title {
	background-image:url(/wp-content/themes/royalagriacademy/img/top/service_title.png);
}

.index #top_main_visual .main_visual_slider.is-ready .slick-slide.is-show .figure_group figure {
 opacity: 1;
 transform: translate3d(0, 0, 0) scale(1);
}

.index #top_main_visual #main_visual_cont .figure_group figure.lazyloaded{
 opacity:1;
 transform: scale(1) translate3d(0,0,0);
}

.index #top_main_visual #main_visual_cont #page_title {
 position:relative;
 z-index:1;
}

.index #top_main_visual #main_visual_cont #page_title img {
}

.index #top_main_visual #main_visual_cont #service_logo {
 position:absolute;
 margin: 0;
 top: calc(5vw + 88px);
 right: auto;
 bottom: auto;
 left: auto;
 align-items:center;
 align-content:center;
 display:flex;
 justify-content:center;
 flex-direction:column;
 row-gap:15px;
 opacity:0;
 -webkit-transition:opacity 3s;
 transition: opacity 3s;
 z-index:3;
}

.index #top_main_visual #main_visual_cont #service_logo.lazyloaded {
 opacity:1;
}

.index #top_main_visual #main_visual_cont #service_logo h2 {
 align-items:center;
 align-content:center;
 background-color:var(--white);
 border-radius:50%;
 display:flex;
 justify-content:center;
 padding:10px;
}

.index #top_main_visual #main_visual_cont #service_logo h2 img {
 border-radius:50%;
 width:5vw;
 max-width:80px;
 height:auto;
 opacity:0;
 -webkit-transition:opacity 3s;
 transition: opacity 3s;
}

.index #top_main_visual #main_visual_cont #service_logo h2 img.lazyloaded {
 opacity:1;
}

.index #top_main_visual #main_visual_cont #service_logo h3 {
 align-items:center;
 align-content:center;
 display:flex;
 justify-content:center;
 flex-direction:column;
 row-gap:8px;
}

.index #top_main_visual #main_visual_cont #service_logo h3 span {
 color:var(--main);
 font-size: calc(1.3rem + ((1vw - 0.48rem) * 0.6944));
 font-weight:600;
}

.index #top_main_visual #main_visual_cont #service_logo h3 span.en {
 font-size: calc(0.7rem + ((1vw - 0.48rem) * 0.6944));
 font-family: roboto, Helvetica, Arial;
 color:var(--main);
}

.index #top_main_visual #main_visual_cont #contents_title {
 position:absolute;
 display:block;
 width:100%;
 height:100%;
}

.index #top_main_visual #main_visual_cont #contents_title img {
 opacity:0;
 -webkit-transition:opacity 3s;
 transition: opacity 3s;
}

.index #top_main_visual #main_visual_cont #contents_title img.lazyloaded {
 opacity:1;
}

.index #top_main_visual #main_visual_cont .scroll_nav {
 position:absolute;
 right:20px;
 bottom:150px;
 height:140px;
 width:40px;
}

.index #top_main_visual #main_visual_cont .scroll_nav:after {
 background-color:var(--color-gray-66);
 content:" ";
 position:absolute;
 height:150px;
 width:40px;
 left:0;
 z-index:-1;
}

.index #top_main_visual #main_visual_cont .scroll_nav.is-active.is-inview .scroll_nav_text {
 display: flex;
 align-content: center;
 align-items: center;
 justify-content: center;
 width:100%;
}

.index #top_main_visual #main_visual_cont .scroll_nav.is-active.is-inview .scroll_nav_text span {
 color:var(--white);
}

.index #top_main_visual #main_visual_cont .scroll_nav.scroll_nav--down .scroll_nav_line:after{
 color:var(--white);
}

.index #top_main_visual #main_visual_cont .scroll_nav.scroll_nav--down.is-active.is-inview .scroll_nav_line:before {
 border-top-color: var(--white);
}

.index #top_main_visual #main_visual_cont .scroll_nav.scroll_nav--down .scroll_nav_line:after {
 border-right-color: var(--white);
}

.index .slick-dots {
 bottom:13vw;
}

/*---------------------------------------------
main
---------------------------------------------*/
.index main {
 background:#D7E7F8;
 background: linear-gradient(180deg,rgba(215, 231, 248, 0.2) 0%, rgba(39, 127, 175, 0.2) 50%, rgba(4, 69, 155, 0.2) 100%);
 display:flex;
 flex-direction:column;
 row-gap:50px;
 margin:-10vw 0 0;
 padding:0;
 position:relative;
 overflow:hidden;
 z-index:1;
}

.index main:before {
 background-size:cover;
 background-repeat:no-repeat;
 background-position:center top;
 content:" ";
 height:100%;
 position:absolute;
 width:100%;
 z-index:-1;
 opacity:1;
 -webkit-transition:opacity 3s;
 transition: opacity 3s;
}

.index main.lazyloaded:before {
	background-image:url(/wp-content/themes/royalagriacademy/img/common/bg_circle.webp);
 opacity:1;
}

/*---------------------------------------------
information
---------------------------------------------*/
#information {
 padding:0 5vw;
}

/*---------------------------------------------
category_menu
---------------------------------------------*/
#category_menu {
 background-color:var(--white);
 display:flex;
 justify-content:center;
 padding:80px 5vw;
}

#category_menu ul {
 display:flex;
 justify-content:space-between;
 max-width:1080px;
 padding:0;
 width:100%;
}
 
#category_menu ul li {
 display:flex;
 flex-direction:column;
 row-gap:20px;
}

#category_menu ul li h3 {
 align-items:center;
 align-content:center;
 display:flex;
 justify-content:center;
 position:relative;
}

#category_menu ul li h3 span {
 position:relative;
}

#category_menu ul li h3 span:before {
 content:" ";
 background-image:url(/wp-content/themes/royalagriacademy/img/common/figure_learn.webp);
 background-repeat:no-repeat;
 background-position:center bottom;
 background-size:contain; 
 position:absolute;
 left:-50px;
 top:50%;
 height:100%;
 max-height:60px;
 width:36px;
 margin-top:-30px;
}

#category_menu ul li.work h3 span:before {
 background-image:url(/wp-content/themes/royalagriacademy/img/common/figure_work.webp);
 left:-50px;
}

#category_menu ul li.experience h3 span:before {
 background-image:url(/wp-content/themes/royalagriacademy/img/common/figure_experience.webp);
 left:-56px;
 width:42px;
}

#category_menu ul li h3 img {
 max-height:60px;
 width:auto;
}

#category_menu ul li figure {
 align-items:center;
 align-content:center;
 display:flex;
 justify-content:center;
}

#category_menu ul li figure img {
 border-radius:10px;
 height:auto;
 opacity:0;
 -webkit-transition:opacity 3s;
 transition: opacity 3s;
 width:100%;
}

#category_menu ul li figure img.lazyloaded {
 opacity:1;
}

#category_menu ul li .btn {
 align-items:center;
 display:flex;
 justify-content:center;
}

#category_menu ul li .btn a {
 font-size:1.5rem;
 max-width:240px;
 width:100%;
}

/*---------------------------------------------
news
---------------------------------------------*/
#news {
 align-items:center;
 display:flex;
 flex-direction:column;
 justify-content:center;
 position:relative;
 row-gap:20px;
 padding:0 0 0 5vw
}

#news:after {
 background-color:var(--white);
 content:" ";
 height:60%;
 position:absolute;
 top:50px;
 left:0;
 width:100%;
 z-index:1;
}

#news .section_title {
 align-items:center; 
 border-top:1px dotted #ddd;
 padding:20px 0 0;
}

#news .section_title h2 {
 align-items:center; 
}

#news .card_list_cont {
 background-color:transparent;
 padding:0; 
}

#news .card_list_cont ol li .content .more_link {
	display:flex;
	justify-content:flex-end;
	margin-top:30px;
}

#news .card_list_cont ol li .content .more_link a {
	font-size:1.2rem;
	position:relative;
	padding-right:15px;
}

#news .card_list_cont ol li .content .more_link a:after {
 color:var(--color-gray-cc);
 content:"\f054";
 font-family:var(--icon);
 font-size:0.9rem;
 line-height: 1;
 font-weight:600; 
 position:absolute;
 bottom:1px;
 right:0;
}

#news .card_list_cont ol li .content .more_link a:hover,
#news .card_list_cont ol li .content .more_link a:hover:after {
 color:var(--link);
}

#news .archive_link {
 position:absolute;
 right:5vw;
 top:150px;
 margin:auto;
 bottom:auto;
 left:0;
 max-width:1080px;
 display:flex;
 align-items:center;
 justify-content:flex-end;
 order:3;
 z-index:11;
}

#news .archive_link a {
 position:relative; 
 max-width:200px;
}

#news .scroll_nav {
 bottom:15px;
 right:5vw;
}

/*---------------------------------------------
voice
---------------------------------------------*/
#voice {
align-items:stretch;
 display:flex;
 flex-direction:unset;
 justify-content:center;
	overflow:hidden;
	position:relative;
	padding:50px 0px 50px 5vw;
 width:100%;
}
 
#voice:before {
	background-color:var(--white);
	border-radius:0 20px 20px 0;
	content:" ";
	height:calc(100% - 100px);
	left:0;
	position:absolute;
	width:50%;
	z-index:-1;
	}

#voice:after {
	background: linear-gradient(45deg,rgba(215, 231, 248, 0.1) 0%, rgba(39, 127, 175, 0.1) 50%, rgba(4, 69, 155, 0.1) 100%);
	border-radius:20px 0 0 20px;
	content:" ";
	height:100%;
	position:absolute;
	width:70%;
	z-index:-2;
	right:0;
	left:auto;
 top:0;
}

#voice .section_title {
	align-items:center;
 border-top:1px dotted #ddd;
	display:flex;
	flex:0 0 35%;
	flex-wrap:wrap;
	justify-content:space-between;
	padding:100px 50px 120px 0; 
	position:relative;
	z-index:2;
}

#voice .section_title h2 {
	align-items:center;
}

#voice .section_title figure {
	max-width: 200px; 
}

#voice .flip_card_list_cont {
 background-color:transparent;
 display:flex;
 flex-direction:unset;
 position:relative;
 overflow:auto;
	width:100%;
}

#voice .flip_card_list_detail {
	align-items:center;
	align-content:center;
	display:flex;
	flex:0 0 65%;
	position:relative;
	z-index:2;
	overflow-x: scroll;
	width:100%;
	height:100%;
}

#voice .flip_card_list_detail .card_list {
 flex-direction:unset;
 padding:50px 50px 50px 0;
}

#voice .scroll_nav {
 bottom:30px;
}