@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=League+Gothic&display=swap');
/*=======================================================
 top.css
 トップページレイアウト用CSS
=======================================================*/

/*======================================================
 共通設定
========================================================*/


/*----------- SP -------------*/
@media screen and (max-width: 767px) {
}

/*----------- PC・タブレット ------------*/

@media (min-width:768px) {
}

body { /*font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;*/ font-family: 'Noto Serif JP', serif; }



/*======================================================
 メインビジュアル スライダー
=======================================================*/
/*.main-visual-wrap {
	width:100%;
	height:90vh;
	min-height:400px;
	}

.main-visual-wrap .fadeLeft{
	animation-name:fadeLeftAnime;
	animation-duration:0.5s;
	animation-fill-mode:forwards;
	opacity:0;
	}

	@keyframes fadeLeftAnime{
		from {
			opacity: 0;
			transform: translateX(-100px);
		}

		to {
			opacity: 1;
			transform: translateX(0);
		}
	}*/

/*
.main-visual{ 
	position: relative;
	height:70vh;
	}

.main-visual-wrap > .mainvisual-yellow-square {
	width: 225px;
	height:225px;
	background:#ffcf07;
	position:absolute;
	bottom:10vh;
	}


#slider {
	width: 80%;
	height: 78vh;
	padding-right:0;
	position: absolute;
	right:0;
	}

.main-visual h2{
	font-family: 'League Gothic', sans-serif;
	font-weight:400;
	position: absolute;
	z-index: 2;
	top: 50%;
	left: 10%;
	text-align: left;
	font-size:60px;
	text-transform: uppercase;
	color: #000;
}
*/

#particles-js { width: 100%; height: 100%; position: fixed; z-index: -1; }

.main-contents { max-width: calc((1120px + 80px) *1); padding: 0 80px; margin: 0 auto; }
.main-wrap { position: relative; margin-top: 60px; height: 500px; }

/*.main-wrap::before {
    content: "";
    position: absolute;
    top: 49px;
    display: inline-block;
    width: calc(100vw - 80px + (100% - 100vw) / 2);
    height: 450px;
    background-color: rgba(255, 255, 255, 0.6);
    border-radius: 30px 0px 0px 30px;
    z-index: 1;
}*/

.top-hero__title__br-sp { display: none; }

.main-visual-img { position: absolute; top: 49px; display: inline-block; width: calc(100vw - 80px + (100% - 100vw) / 2); height: 450px; border-radius: 30px 0px 0px 30px; z-index: 0; object-fit: cover; max-width: none; }

.main_title { position: relative; margin-left: -206px; font-weight: 600; font-size: 64px; font-family: 'Frank Ruhl Libre', serif; line-height: 86px; letter-spacing: -0.04em; z-index: 2; text-align: left; }
.main_title span { filter: blur(10px); opacity: 0; }
.main_title .textanim { transition: all 800ms; }


/*スクロールダウン全体の場所*/
.scrolldown { /*描画位置※位置は適宜調整してください*/ position: relative; left: 50%; top: 70px; margin-bottom: 100px; }

/*Scrollテキストの描写*/
.scrolldown span { /*描画位置*/ position: absolute; left: 10px; bottom: 2px; /*テキストの形状*/ color: #333; font-size: 12px; letter-spacing: 0.3em; /*縦書き設定*/ -ms-writing-mode: tb-rl; -webkit-writing-mode: vertical-rl; writing-mode: vertical-rl; }

/* 丸の描写 */
.scrolldown:before { content: ""; /*描画位置*/ position: absolute; bottom: 0; left: -4px; /*丸の形状*/ width: 10px; height: 10px; border-radius: 50%; background: #333; /*丸の動き1.6秒かけて透過し、永遠にループ*/ animation: circlemove 1.6s ease-in-out infinite, cirlemovehide 1.6s ease-out infinite; }

/*下からの距離が変化して丸の全体が上から下に動く*/
@keyframes circlemove {
    0% { bottom: 55px; }
    100% { bottom: -5px; }
}

/*上から下にかけて丸が透過→不透明→透過する*/
@keyframes cirlemovehide {
    0% { opacity: 0 }
    50% { opacity: 1; }
    80% { opacity: 0.9; }
    100% { opacity: 0; }
}

/* 線の描写 */
.scrolldown:after { content: ""; /*描画位置*/ position: absolute; bottom: 0; left: 0; /*線の形状*/ width: 2px; height: 60px; background: #333; }

@media (max-width:1280px) {
    .main_title { margin-left: -56px; font-size: 54px; line-height: 66px; }
}


@media (max-width: 767px) {
    .main-contents { padding: 0 40px; }
    .main-visual-img { width: calc(100vw - 40px + (100% - 100vw) / 2); }
    .main_title { padding-top: 36px; margin-left: -15px; font-size: 28px; line-height: 150%; letter-spacing: 0.05em; }
}

/*scroll*/

.scroll_top { margin-top: 8px; margin-bottom: 120px; font-weight: bold; font-size: 12px; line-height: 18px; letter-spacing: 0.15em; }

@media (max-width: 767px) {
    .scroll_top { margin-top: 30px; margin-bottom: 30px; }
}



/*----------- PC ------------*/
@media screen and (min-width:1024px) {

    /*.main-visual-wrap > .mainvisual-yellow-square {
		width: 450px;
		height:450px;
		bottom:10vh;
		}

	.main-visual h2{ 
		font-size:100px;
		top: 35%;
		}*/


}


/*----------- PC・タブレット ------------*/

@media (min-width:768px) {

    /*.main-visual-wrap {
		width:100%;
		}
	
	.main-visual{ 
		position: relative;
		height:80vh;
		}

	.main-visual-wrap > .mainvisual-yellow-square {
		width: 450px;
		height:450px;
		bottom:15vh;
		left:10vw;
		}
	
	.main-visual h2{ 
		font-size:90px;
		top: 40%;
		left: 15%;
		}*/


}

/*----------- スマートフォン ------------*/

@media (max-width:768px) {
    #service { margin: 0 10px; }
    /*.main-visual h2 { font-weight:bold; } */

}

.head-wrap { margin-bottom: 75pt; }
.head-ttl { font-weight: 600; font-size: 3pc; line-height: 56px; letter-spacing: 0.024em; text-align: left; margin-bottom: 8px; }
.head-txt { font-size: 1pc; line-height: 28px; }
.head-txt span { display: inline-block; background-color: #444; width: 56px; height: 1px; vertical-align: middle; margin-right: 20px }

.sub-head-wrap { margin-bottom: 30pt; }
.sub-head-ttl { font-weight: 500; font-size: 2pc; line-height: 56px; letter-spacing: 0.024em; text-align: left; margin-bottom: 8px; }

/*----------- タブレット縦　------------*/
@media screen and (max-width: 1024px) and (orientation: portrait) {
    #top section { padding: 0 10px; }
}
/*----------- スマホ　------------*/
@media (max-width: 767px) {
    .head-ttl { font-size: 32px; }
    .head-wrap { margin-bottom: 35pt; }
    #top #easypage-achievement .achievement-list p { font-size: 14px; }
    .sub-head-ttl { font-size: 20px; }
}

/*======================================================
 VISION
=======================================================*/
#top #vision h2 { font-family: 'Frank Ruhl Libre', serif; font-weight: 400; font-size: 13rem; color: #FFF1B4; }

#top #vision p.copy-txt { font-family: "Times New Roman", "游明朝", YuMincho,"ヒラギノ明朝 Pr6 W6","Hiragino Mincho Pro", "HGS明朝E","メイリオ", "ＭＳ Ｐ明朝","MS PMincho",Meiryo, serif; text-align: center; }

#top #vision .vision-list { display: flex; position: relative; }
#top #vision .vision-list .left { max-width: 830px; }
#top #vision .vision-list .right { background-color: #444; color: #f2e6d4; width: 762px; height: 553px; position: absolute; right: 0; z-index: 2; top: 60px; padding: 90pt; }
#top #vision .vision-list .right .head-txt { margin-bottom: 40px; }
#top #vision .vision-list .right .head-txt h2 { color: #f2e6d4; font-style: normal; font-weight: 500; font-size: 5rem; line-height: 56px; text-align: left; letter-spacing: 0.024em; margin-bottom: 8px; }

#top #vision .vision-list .right .head-txt p span { background-color: #f2e6d4; margin-right: 20px; display: inline-block; width: 56px; height: 1px; vertical-align: middle; }
#top #vision .vision-list .right p { font-family: 'Noto Serif JP', serif; font-weight: 500; font-size: 1pc; line-height: 28px; letter-spacing: 0.082em; margin-bottom: 20px; }
#top #vision .vision-list .right .btn-block { text-align: right; padding-top: 30px; }
#top #vision .vision-list .right .learn-more .circle { background: #fff; }
#top #vision .vision-list .right .learn-more .circle .icon.arrow::before { border-top: 0.2rem solid #333; border-right: 0.2rem solid #333; }
#top #vision .vision-list .right .learn-more .circle { background: #fff; }
#top #vision .vision-list .right .learn-more:hover .button-text { color: #333; }
#top #vision .vision-list .right .learn-more .button-text { color: #fff; }

/*----------- PC・タブレット ------------*/

@media (min-width:768px) {
    #top #vision p.copy-txt { font-size: 3.0rem; }
}

/*----------- スマホ　------------*/
@media (max-width: 767px) {
    #top #vision .vision-list .right { width: 91.7%; padding: 46px 1pc 40px 44px; max-height: 27.8pc; top: calc(100% - 27.05pc); bottom: 0; height: 430px; }
    #top #vision .vision-list .right .btn-block { padding-top: 10px; }
    #top #vision .vision-list .left picture img { height: auto; }
    #top #vision .vision-list .right .head-txt h2 { font-size: 2pc; line-height: 37px; letter-spacing: 0.024em; }
    #top #vision .vision-list .right p { font-size: 14px; }
}

/*======================================================
Service
=======================================================*/
/*#top #service {
	background:#FFCF07 url(../images/img-yellow-triangle01.jpg) no-repeat top right;
	background-size:contain;
	}

#top #service h3 {
    font-family: 'League Gothic', sans-serif;
    font-weight:400;
    font-size:8.0rem;
    border-bottom:none;
    line-height:1.0;
	margin-bottom:20px;
    }

#top #service h3 .font-s { font-size:2.5rem; }

#top #service .service-block.col2-box { margin-bottom:0; }
#top #service .service-development .service-block.col2-box { margin-bottom:70px; } */
/*#top #service { position: relative; background: rgba(255,207,7,0.7); }
#top #service:before { position: absolute; left: 0; bottom: calc(100% - 0.1px); content: ""; background: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.5.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='レイヤー_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 1432.9 697.8' preserveAspectRatio='none' style='enable-background:new 0 0 1432.9 697.8;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bdisplay:none;fill:%23EFB473;%7D .st1%7Bdisplay:none;fill:%23ED9829;%7D .st2%7Bfill:%23FFCF07;%7D%0A%3C/style%3E%3Cpath class='st0' d='M-1.5,183.2C143.1,225.4,477.2,42.1,597.8,38.1c395.6-13.1,351.7,794,835.4,633.2L1432.4,0H-2.2L-1.5,183.2z'/%3E%3Cpath class='st1' d='M-2.2,0c0,0,86.5,51.9,230.5,44.5S388.5,13.9,501.5,3.2C742.7-19.7,886.3,195.5,978,350.5 c105.2,177.9,313.4,282,456.3,135.5l-1.9-486L-2.2,0L-2.2,0z'/%3E%3Cpath class='st2' d='M-3.6,541c260.2,305.9,504.4,49.5,722.5-204.7c99.1-115.6,188.2-233.1,279.2-293 c188.8-124.2,412.1,65.5,435.2,223.4c0,0-1.1,433-1.1,433L-1.5,700.9L-3.6,541z'/%3E%3C/svg%3E%0A") 50%/100% 100% no-repeat; width: 100%; height: 95px; opacity: .7; }
#top #service:after { position: absolute; left: 0; top: calc(100% - 0px); content: ""; background: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.5.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='レイヤー_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 1432.9 697.8' preserveAspectRatio='none' style='enable-background:new 0 0 1432.9 697.8;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23FFF3C0;%7D .st1%7Bfill:%23FFCF07;%7D .st2%7Bdisplay:none;fill:%23ED9829;%7D%0A%3C/style%3E%3Cpath class='st0' d='M-1.5,183.2C143.1,225.4,477.2,42.1,597.8,38.1c395.6-13.1,351.7,794,835.4,633.2L1432.4,0H-2.2L-1.5,183.2z'/%3E%3Cpath class='st1' d='M-2.2,0c0,0,86.5,51.9,230.5,44.5S388.5,13.9,501.5,3.2C742.7-19.7,886.3,195.5,978,350.5 c105.2,177.9,313.4,282,456.3,135.5l-1.9-486L-2.2,0L-2.2,0z'/%3E%3Cpath class='st2' d='M-3.6,541c260.2,305.9,504.4,49.5,722.5-204.7c99.1-115.6,188.2-233.1,279.2-293 c188.8-124.2,412.1,65.5,435.2,223.4c0,0-1.1,433-1.1,433L-1.5,700.9L-3.6,541z'/%3E%3C/svg%3E%0A") 50%/100% 100% no-repeat; width: 100%; height: 243px; opacity: .7; }*/
#top #service .service-wrap { display: flex; justify-content: space-between; flex-wrap: wrap; color: #444; }
#top #service .service-movie-wrap { margin-bottom: 100px; }
#top #service .service-wrap .sub-head-wrap { width: calc((100% / 2) - 20px); }
#top #service .service-wrap .service-left { width: calc((100% / 2) - 20px); padding: 22px; background: #fff; box-shadow: 0 0 8px #c5c5c5; max-height: 460px; }
#top #service .service-wrap .service-right { width: calc((100% / 2) - 20px); padding: 22px; background: #fff; box-shadow: 0 0 8px #c5c5c5; max-height: 460px; }

#top #service .service-wrap > div:nth-child(3),
#top #service .service-wrap > div:nth-child(5) { margin-top: -320px; }

#top #service .movie-wrap > div:nth-child(2n) { margin-top: 100px; }

#top #service .service-wrap > div:nth-child(4),
#top #service .service-wrap > div:nth-child(6) { margin-top: 100px; }

#top #service .service-wrap .serv-ttl,
#top #service .service-movie-wrap .serv-ttl { border: 0; margin-bottom: 5px; font-size: 24px; font-weight: 500; line-height: 35px; letter-spacing: 0.082em; }

#top #service .service-wrap .txt,
#top #service .service-movie-wrap .txt { font-size: 14px; }

#top #service .service-wrap .serv-txt-wrap,
#top #service .service-movie-wrap .serv-txt-wrap { padding-top: 5px; }

#top #service .service-wrap .serv-subttl-btn,
#top #service .service-movie-wrap .serv-subttl-btn { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }


#top #service .service-wrap .serv-img { position: relative; width: 508px; height: 343px; background-color: #f7f7f7; display: inline-block; padding: 90pt; }
#top #service .service-wrap .serv-img img,
#top #service .service-movie-wrap .serv-img img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); }
#top #service .service-wrap .serv-img img { width: 240px; }
#top #service .service-movie-wrap .serv-img img { width: 380px; }

#top #service .service-wrap .serv-img .serv-btn,
#top #service .service-movie-wrap .serv-img .serv-btn { position: absolute; bottom: 20px; right: 20px; }

#top #service .service-wrap .serv-img .btn-block .learn-more .circle,
#top #service .service-movie-wrap .serv-img .btn-block .learn-more .circle { background: #444; }
#top #service .service-wrap .serv-img .btn-block .learn-more .circle .icon.arrow::before,
#top #service .service-movie-wrap .serv-img .btn-block .learn-more .circle .icon.arrow::before { border-top: 0.2rem solid #fff; border-right: 0.2rem solid #fff; }
#top #service .service-wrap .serv-img .btn-block .learn-more:hover .button-text,
#top #service .service-movie-wrap .serv-img .btn-block .learn-more:hover .button-text { color: #fff; }
#top #service .service-wrap .serv-img .btn-block .learn-more .button-text,
#top #service .service-movie-wrap .serv-img .btn-block .learn-more .button-text { color: #444; font-weight: 700; }
#top #service .service-wrap .serv-img .btn-block .learn-more:hover .circle .icon.arrow,
#top #service .service-movie-wrap .serv-img .btn-block .learn-more:hover .circle .icon.arrow { background: #444; }

#top #service .service-movie-wrap .movie-wrap { display: flex; flex-wrap: wrap; justify-content: space-between; }

#top #service .service-movie-wrap .movie-wrap .service-left { width: calc((100% / 2) - 20px); padding: 22px; background: #fff; box-shadow: 0 0 8px #c5c5c5; max-height: 500px; }
#top #service .service-movie-wrap .movie-wrap .service-right { width: calc((100% / 2) - 20px); padding: 22px; background: #fff; box-shadow: 0 0 8px #c5c5c5; max-height: 500px; }

#top #service .service-movie-wrap .serv-img { position: relative; width: 508px; height: 343px; background-color: #f7f7f7; display: inline-block; padding: 90pt; }

#top #service .service-wrap .serv-ttl.jp,
#top #service .service-movie-wrap .serv-ttl.jp { font-weight: 600; }

/*----------- タブレット縦　------------*/
@media screen and (max-width: 1024px) and (orientation: portrait) {
    #top #service .service-wrap .serv-img,
    #top #service .service-movie-wrap .serv-img { width: 338px; }
    #top #service .service-wrap .serv-img img { width: 210px; }
    #top #service .service-movie-wrap .serv-img img { width: 380px; }
}


/*----------- スマホ　------------*/
@media (max-width: 767px) {
    /*  #top #service:before { background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.5.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='レイヤー_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 1432.9 697.8' preserveAspectRatio='none' style='enable-background:new 0 0 1432.9 697.8;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bdisplay:none;fill:%23EFB473;%7D .st1%7Bdisplay:none;fill:%23ED9829;%7D .st2%7Bfill:%23FFCF07;%7D%0A%3C/style%3E%3Cpath class='st0' d='M-1.5,183.2C143.1,225.4,477.2,42.1,597.8,38.1c395.6-13.1,351.7,794,835.4,633.2L1432.4,0H-2.2L-1.5,183.2z'/%3E%3Cpath class='st1' d='M-2.2,0c0,0,86.5,51.9,230.5,44.5S388.5,13.9,501.5,3.2C742.7-19.7,886.3,195.5,978,350.5 c105.2,177.9,313.4,282,456.3,135.5l-1.9-486L-2.2,0L-2.2,0z'/%3E%3Cpath class='st2' d='M-3.6,541c260.2,305.9,504.4,49.5,722.5-204.7c99.1-115.6,188.2-233.1,279.2-293 c188.8-124.2,412.1,65.5,435.2,223.4c0,0-1.1,433-1.1,433L-1.5,700.9L-3.6,541z'/%3E%3C/svg%3E%0A"); background-size: 100% 100%; height: 35px; }
    #top #service:after { background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.5.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='レイヤー_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 1432.9 697.8' preserveAspectRatio='none' style='enable-background:new 0 0 1432.9 697.8;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23FFF3C0;%7D .st1%7Bfill:%23FFCF07;%7D .st2%7Bdisplay:none;fill:%23ED9829;%7D%0A%3C/style%3E%3Cpath class='st0' d='M-1.5,183.2C143.1,225.4,477.2,42.1,597.8,38.1c395.6-13.1,351.7,794,835.4,633.2L1432.4,0H-2.2L-1.5,183.2z'/%3E%3Cpath class='st1' d='M-2.2,0c0,0,86.5,51.9,230.5,44.5S388.5,13.9,501.5,3.2C742.7-19.7,886.3,195.5,978,350.5 c105.2,177.9,313.4,282,456.3,135.5l-1.9-486L-2.2,0L-2.2,0z'/%3E%3Cpath class='st2' d='M-3.6,541c260.2,305.9,504.4,49.5,722.5-204.7c99.1-115.6,188.2-233.1,279.2-293 c188.8-124.2,412.1,65.5,435.2,223.4c0,0-1.1,433-1.1,433L-1.5,700.9L-3.6,541z'/%3E%3C/svg%3E%0A"); background-size: 100% 100%; height: 45px; }*/
    #top #service .service-wrap .sub-head-wrap,
    #top #service .service-wrap .service-left,
    #top #service .service-wrap .service-right,
    #top #service .service-movie-wrap .movie-wrap .service-left,
    #top #service .service-movie-wrap .movie-wrap .service-right { width: 100%; margin-bottom: 20px; max-height: none; }
    #top #service .service-wrap > div:nth-child(3),
    #top #service .service-wrap > div:nth-child(5),
    #top #service .service-wrap > div:nth-child(4),
    #top #service .service-wrap > div:nth-child(6) { margin-top: 0; }
    #top #service .service-wrap .service-left,
    #top #service .service-movie-wrap .service-left { max-height: none; }
    #top #service .service-wrap .serv-img,
    #top #service .service-movie-wrap .serv-img { width: 100%; }
    #top #service .service-wrap .serv-img,
    #top #service .service-movie-wrap .serv-img { height: 230px; }
    #top #service .service-wrap .serv-img img,
    #top #service .service-movie-wrap .serv-img img { width: 200px; top: 48%; }
    #top #service .service-wrap .service-right,
    #top #service .service-movie-wrap .service-right { padding: 15px; }
    #top #service .service-wrap .serv-ttl,
    #top #service .service-movie-wrap .serv-ttl { font-size: 18px; }
    #top #service .service-wrap .serv-ttl.en { font-size: 24px; width: 100%; text-align: center; }
    #top #service .service-wrap .serv-subttl-btn, #top #service .service-movie-wrap .serv-subttl-btn { flex-wrap: wrap; justify-content: center; }
    #top #service .movie-wrap > div:nth-child(2n) { margin-top: auto; }
}


/*======================================================
PERFORMANCE
=======================================================*/

#easypage-achievement .achievement-wrap .head-wrap { text-align: left; }

#top #easypage-achievement .achievement-wrap .update-wrap { margin-bottom: 50px; }
#top #easypage-achievement .achievement-wrap .update-wrap .img-wrap { display: flex; align-items: flex-start; }
#top #easypage-achievement .achievement-wrap .update-wrap .performance-1 { position: relative; }
#top #easypage-achievement .achievement-wrap .update-wrap .performance-1 span { position: absolute; left: 8.5%; top: 53%; font-size: 130px; font-weight: 700; color: #f79c23; }

#top #easypage-achievement .achievement-wrap .update-wrap .performance-2 { position: relative; }
#top #easypage-achievement .achievement-wrap .update-wrap .performance-2 img { width: 180px; margin-top: -30px; }
#top #easypage-achievement .achievement-wrap .update-wrap .performance-2 span { position: absolute; left: 20.5%; top: 5%; font-size: 40px; font-weight: 700; color: #fff; }
#top #easypage-achievement .achievement-wrap .update-wrap .performance-2 span small { font-size: 20px; }
#top #easypage-achievement .achievement-wrap .update-wrap .performance-3 img { width: 260px; }

/*----------- タブレット縦　------------*/
@media screen and (max-width: 1024px) and (orientation: portrait) {
    #top #easypage-achievement .achievement-wrap .update-wrap span { font-size: 11vw; }
    #top #easypage-achievement .achievement-wrap .update-wrap .performance-1 span { font-size: 90px; }
    #top #easypage-achievement .achievement-wrap .update-wrap .performance-2 span { font-size: 30px; left: 17.5%; top: -6%; }
}

/*----------- スマートフォン ------------*/
@media (max-width:767px) {

    #top #easypage-achievement:before { background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.5.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='レイヤー_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 1432.9 697.8' preserveAspectRatio='none' style='enable-background:new 0 0 1432.9 697.8;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bdisplay:none;fill:%23EFB473;%7D .st1%7Bdisplay:none;fill:%23ED9829;%7D .st2%7Bfill:%23FFCF07;%7D%0A%3C/style%3E%3Cpath class='st0' d='M-1.5,183.2C143.1,225.4,477.2,42.1,597.8,38.1c395.6-13.1,351.7,794,835.4,633.2L1432.4,0H-2.2L-1.5,183.2z'/%3E%3Cpath class='st1' d='M-2.2,0c0,0,86.5,51.9,230.5,44.5S388.5,13.9,501.5,3.2C742.7-19.7,886.3,195.5,978,350.5 c105.2,177.9,313.4,282,456.3,135.5l-1.9-486L-2.2,0L-2.2,0z'/%3E%3Cpath class='st2' d='M-3.6,541c260.2,305.9,504.4,49.5,722.5-204.7c99.1-115.6,188.2-233.1,279.2-293 c188.8-124.2,412.1,65.5,435.2,223.4c0,0-1.1,433-1.1,433L-1.5,700.9L-3.6,541z'/%3E%3C/svg%3E%0A"); background-size: 100% 100%; height: 35px; }
    #top #easypage-achievement:after { background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.5.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='レイヤー_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 1432.9 697.8' preserveAspectRatio='none' style='enable-background:new 0 0 1432.9 697.8;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23FFF3C0;%7D .st1%7Bfill:%23FFCF07;%7D .st2%7Bdisplay:none;fill:%23ED9829;%7D%0A%3C/style%3E%3Cpath class='st0' d='M-1.5,183.2C143.1,225.4,477.2,42.1,597.8,38.1c395.6-13.1,351.7,794,835.4,633.2L1432.4,0H-2.2L-1.5,183.2z'/%3E%3Cpath class='st1' d='M-2.2,0c0,0,86.5,51.9,230.5,44.5S388.5,13.9,501.5,3.2C742.7-19.7,886.3,195.5,978,350.5 c105.2,177.9,313.4,282,456.3,135.5l-1.9-486L-2.2,0L-2.2,0z'/%3E%3Cpath class='st2' d='M-3.6,541c260.2,305.9,504.4,49.5,722.5-204.7c99.1-115.6,188.2-233.1,279.2-293 c188.8-124.2,412.1,65.5,435.2,223.4c0,0-1.1,433-1.1,433L-1.5,700.9L-3.6,541z'/%3E%3C/svg%3E%0A"); background-size: 100% 100%; height: 45px; }

    #top #easypage-achievement .achievement-wrap .update-wrap span { letter-spacing: -1.5px; }
    #top #easypage-achievement .achievement-wrap .update-wrap .img-wrap { flex-wrap: wrap; }
    #top #easypage-achievement .achievement-wrap .update-wrap .performance-sp-1 { position: relative; margin-bottom: 10px; }
    #top #easypage-achievement .achievement-wrap .update-wrap .performance-sp-1 span { position: absolute; left: 8.5%; top: 70%; font-size: 13.5vw; font-weight: 700; color: #f79c23; letter-spacing: -2px; }
    #top #easypage-achievement .achievement-wrap .update-wrap .performance-sp-2 { position: relative; width: 100%; }
    #top #easypage-achievement .achievement-wrap .update-wrap .performance-sp-2 .perf-sp-img-wrap { display: flex; }
    #top #easypage-achievement .achievement-wrap .update-wrap .performance-sp-2 .perf-sp-img-wrap .perf-img-year { position: relative; }
    #top #easypage-achievement .achievement-wrap .update-wrap .performance-sp-2 .perf-sp-img-wrap .perf-img-year img { position: relative; width: 70px; }
    #top #easypage-achievement .achievement-wrap .update-wrap .performance-sp-2 .perf-sp-img-wrap .perf-img-year span { position: absolute; color: #fff; top: 10px; right: 8px; font-size: 4.5vw; letter-spacing: 0; }
    #top #easypage-achievement .achievement-wrap .update-wrap .performance-sp-2 .perf-sp-img-wrap .perf-img-year span small { font-size: 12px; }
    #top #easypage-achievement .achievement-wrap .update-wrap .performance-sp-2 .perf-sp-img-wrap img:last-child { position: absolute; top: 10px; right: -20px; width: 130px; }
    #top #easypage-achievement .achievement-wrap .update-wrap .performance-sp-2 .perf-update .perf-update-ttl { display: block; margin: 20px 0 15px; padding: 10px; background: #f79c23; border-radius: 50px; color: #fff; font-weight: 700; font-size: 4.5vw; width: 50%; text-align: center; }
    #top #easypage-achievement .achievement-wrap .update-wrap .performance-sp-2 .perf-update .perf-update-txt { color: #f79c23; font-weight: 700; padding-left: 50px; }
    #top #easypage-achievement .achievement-wrap .update-wrap .performance-sp-3 { width: 40%; }
}


/*======================================================
NEWS
=======================================================*/


#top-info { position: relative; background: rgba(255,207,7,0.7); }
#top-info:before { position: absolute; left: 0; bottom: calc(100% - 0.1px); content: ""; background: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.5.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='レイヤー_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 1432.9 697.8' preserveAspectRatio='none' style='enable-background:new 0 0 1432.9 697.8;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bdisplay:none;fill:%23EFB473;%7D .st1%7Bdisplay:none;fill:%23ED9829;%7D .st2%7Bfill:%23FFCF07;%7D%0A%3C/style%3E%3Cpath class='st0' d='M-1.5,183.2C143.1,225.4,477.2,42.1,597.8,38.1c395.6-13.1,351.7,794,835.4,633.2L1432.4,0H-2.2L-1.5,183.2z'/%3E%3Cpath class='st1' d='M-2.2,0c0,0,86.5,51.9,230.5,44.5S388.5,13.9,501.5,3.2C742.7-19.7,886.3,195.5,978,350.5 c105.2,177.9,313.4,282,456.3,135.5l-1.9-486L-2.2,0L-2.2,0z'/%3E%3Cpath class='st2' d='M-3.6,541c260.2,305.9,504.4,49.5,722.5-204.7c99.1-115.6,188.2-233.1,279.2-293 c188.8-124.2,412.1,65.5,435.2,223.4c0,0-1.1,433-1.1,433L-1.5,700.9L-3.6,541z'/%3E%3C/svg%3E%0A") 50%/100% 100% no-repeat; width: 100%; height: 95px; opacity: .7; }
#top-info:after { position: absolute; left: 0; top: calc(100% - 0px); content: ""; background: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.5.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='レイヤー_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 1432.9 697.8' preserveAspectRatio='none' style='enable-background:new 0 0 1432.9 697.8;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23FFF3C0;%7D .st1%7Bfill:%23FFCF07;%7D .st2%7Bdisplay:none;fill:%23ED9829;%7D%0A%3C/style%3E%3Cpath class='st0' d='M-1.5,183.2C143.1,225.4,477.2,42.1,597.8,38.1c395.6-13.1,351.7,794,835.4,633.2L1432.4,0H-2.2L-1.5,183.2z'/%3E%3Cpath class='st1' d='M-2.2,0c0,0,86.5,51.9,230.5,44.5S388.5,13.9,501.5,3.2C742.7-19.7,886.3,195.5,978,350.5 c105.2,177.9,313.4,282,456.3,135.5l-1.9-486L-2.2,0L-2.2,0z'/%3E%3Cpath class='st2' d='M-3.6,541c260.2,305.9,504.4,49.5,722.5-204.7c99.1-115.6,188.2-233.1,279.2-293 c188.8-124.2,412.1,65.5,435.2,223.4c0,0-1.1,433-1.1,433L-1.5,700.9L-3.6,541z'/%3E%3C/svg%3E%0A") 50%/100% 100% no-repeat; width: 100%; height: 243px; opacity: .7; }

#top-info .info-list li { transition: transform .6s cubic-bezier(.215,.61,.355,1),opacity .6s linear,-webkit-transform .6s cubic-bezier(.215,.61,.355,1); border-bottom: 1px solid #444; margin-bottom: 0; }
#top-info .info-list li:hover { background: rgba(255, 255, 255, 0.2); }
#top-info .info-list li a { display: flex; align-items: center; padding: 40px; transition: background-color 0.3s; font-weight: 700; }
#top-info .info-list li a:hover { color: #444; }
#top-info .info-list li .news-data { flex: 0 0 auto; width: 135px; font-size: 14px; }
#top-info .info-list li .news-tag { flex: 0 0 auto; width: 100px; height: 30px; margin: 0 50px 0 0; font-size: 12px; display: flex; align-items: center; justify-content: center; color: #fff; letter-spacing: 0.3em; background: #1f1f1f; }
#top-info .info-list li .news-txt { flex: 1 1 auto; font-size: 14px; }


/*----------- スマートフォン ------------*/
@media (max-width:768px) {
    #top-info:before { background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.5.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='レイヤー_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 1432.9 697.8' preserveAspectRatio='none' style='enable-background:new 0 0 1432.9 697.8;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bdisplay:none;fill:%23EFB473;%7D .st1%7Bdisplay:none;fill:%23ED9829;%7D .st2%7Bfill:%23FFCF07;%7D%0A%3C/style%3E%3Cpath class='st0' d='M-1.5,183.2C143.1,225.4,477.2,42.1,597.8,38.1c395.6-13.1,351.7,794,835.4,633.2L1432.4,0H-2.2L-1.5,183.2z'/%3E%3Cpath class='st1' d='M-2.2,0c0,0,86.5,51.9,230.5,44.5S388.5,13.9,501.5,3.2C742.7-19.7,886.3,195.5,978,350.5 c105.2,177.9,313.4,282,456.3,135.5l-1.9-486L-2.2,0L-2.2,0z'/%3E%3Cpath class='st2' d='M-3.6,541c260.2,305.9,504.4,49.5,722.5-204.7c99.1-115.6,188.2-233.1,279.2-293 c188.8-124.2,412.1,65.5,435.2,223.4c0,0-1.1,433-1.1,433L-1.5,700.9L-3.6,541z'/%3E%3C/svg%3E%0A"); background-size: 100% 100%; height: 35px; }
    #top-info:after { background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.5.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='レイヤー_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 1432.9 697.8' preserveAspectRatio='none' style='enable-background:new 0 0 1432.9 697.8;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23FFF3C0;%7D .st1%7Bfill:%23FFCF07;%7D .st2%7Bdisplay:none;fill:%23ED9829;%7D%0A%3C/style%3E%3Cpath class='st0' d='M-1.5,183.2C143.1,225.4,477.2,42.1,597.8,38.1c395.6-13.1,351.7,794,835.4,633.2L1432.4,0H-2.2L-1.5,183.2z'/%3E%3Cpath class='st1' d='M-2.2,0c0,0,86.5,51.9,230.5,44.5S388.5,13.9,501.5,3.2C742.7-19.7,886.3,195.5,978,350.5 c105.2,177.9,313.4,282,456.3,135.5l-1.9-486L-2.2,0L-2.2,0z'/%3E%3Cpath class='st2' d='M-3.6,541c260.2,305.9,504.4,49.5,722.5-204.7c99.1-115.6,188.2-233.1,279.2-293 c188.8-124.2,412.1,65.5,435.2,223.4c0,0-1.1,433-1.1,433L-1.5,700.9L-3.6,541z'/%3E%3C/svg%3E%0A"); background-size: 100% 100%; height: 35px; }


    #top-info .info-list li a { flex-wrap: wrap; padding: 20px; }
    #top-info .info-list li .news-data { width: 85px; }
    #top-info .info-list li .news-tag { font-size: 10px; height: 20px; width: 85px; }
    #top-info .info-list li .news-txt { margin-top: 10px; }
    #top-info .info-list li a { font-weight: normal; }
}

/*======================================================
EasyPage実績
=======================================================*/
/*#top #easypage-achievement { background:#FFF8DA; }*/

/*#top #easypage-achievement p { font-size:1.6rem; }*/

#top #easypage-achievement { position: relative; background: rgba(255,207,7,0.7); }
#top #easypage-achievement:before { position: absolute; left: 0; bottom: calc(100% - 0.1px); content: ""; background: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.5.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='レイヤー_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 1432.9 697.8' preserveAspectRatio='none' style='enable-background:new 0 0 1432.9 697.8;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bdisplay:none;fill:%23EFB473;%7D .st1%7Bdisplay:none;fill:%23ED9829;%7D .st2%7Bfill:%23FFCF07;%7D%0A%3C/style%3E%3Cpath class='st0' d='M-1.5,183.2C143.1,225.4,477.2,42.1,597.8,38.1c395.6-13.1,351.7,794,835.4,633.2L1432.4,0H-2.2L-1.5,183.2z'/%3E%3Cpath class='st1' d='M-2.2,0c0,0,86.5,51.9,230.5,44.5S388.5,13.9,501.5,3.2C742.7-19.7,886.3,195.5,978,350.5 c105.2,177.9,313.4,282,456.3,135.5l-1.9-486L-2.2,0L-2.2,0z'/%3E%3Cpath class='st2' d='M-3.6,541c260.2,305.9,504.4,49.5,722.5-204.7c99.1-115.6,188.2-233.1,279.2-293 c188.8-124.2,412.1,65.5,435.2,223.4c0,0-1.1,433-1.1,433L-1.5,700.9L-3.6,541z'/%3E%3C/svg%3E%0A") 50%/100% 100% no-repeat; width: 100%; height: 95px; opacity: .7; }
#top #easypage-achievement:after { position: absolute; left: 0; top: calc(100% - 0px); content: ""; background: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.5.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='レイヤー_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 1432.9 697.8' preserveAspectRatio='none' style='enable-background:new 0 0 1432.9 697.8;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23FFF3C0;%7D .st1%7Bfill:%23FFCF07;%7D .st2%7Bdisplay:none;fill:%23ED9829;%7D%0A%3C/style%3E%3Cpath class='st0' d='M-1.5,183.2C143.1,225.4,477.2,42.1,597.8,38.1c395.6-13.1,351.7,794,835.4,633.2L1432.4,0H-2.2L-1.5,183.2z'/%3E%3Cpath class='st1' d='M-2.2,0c0,0,86.5,51.9,230.5,44.5S388.5,13.9,501.5,3.2C742.7-19.7,886.3,195.5,978,350.5 c105.2,177.9,313.4,282,456.3,135.5l-1.9-486L-2.2,0L-2.2,0z'/%3E%3Cpath class='st2' d='M-3.6,541c260.2,305.9,504.4,49.5,722.5-204.7c99.1-115.6,188.2-233.1,279.2-293 c188.8-124.2,412.1,65.5,435.2,223.4c0,0-1.1,433-1.1,433L-1.5,700.9L-3.6,541z'/%3E%3C/svg%3E%0A") 50%/100% 100% no-repeat; width: 100%; height: 243px; opacity: .7; }
#top #easypage-achievement strong { font-size: 2.7rem; font-weight: 500; line-height: 1.4em; display: inline-block; margin-bottom: 60px; border-bottom: 2px solid #f79c23; padding-bottom: 10px; }

#top #easypage-achievement strong .numeric { font-size: 4.5rem; }

#top #easypage-achievement .achievement-list { display: flex; justify-content: space-between; margin-bottom: 10px; }
#top #easypage-achievement .achievement-list li { display: flex; justify-content: center; align-items: center; flex-direction: column; padding: 22px; background: #fff; box-shadow: 0 0 8px #c5c5c5; max-height: 470px; width: calc((100% / 2) - 10px); }
#top #easypage-achievement .achievement-list li img { width: 50px; }
#top #easypage-achievement .achievement-list li span { display: block; color: #444; font-size: 40px; font-weight: 700; padding: 30px 0; transition: all 0.3s ease; }
#top #easypage-achievement .achievement-list li span:hover { color: #f79c23; }
#top #easypage-achievement .achievement-txt { font-size: 22px; }



/*----------- PC ------------*/
@media screen and (min-width:980px) {
    #top #easypage-achievement { text-align: center; }

    /*#top #easypage-achievement p { font-size:2.0rem; }*/

    #top #easypage-achievement strong { font-size: 4.0rem; }
    #top #easypage-achievement strong .numeric { font-size: 6.0rem; }
}

/*----------- スマートフォン ------------*/
@media (max-width:768px) {
    #top #easypage-achievement .achievement-list { flex-wrap: wrap; }
    #top #easypage-achievement .achievement-list li { width: calc((100% / 2) - 5px); margin-bottom: 10px; }
    #top #easypage-achievement .achievement-list li span { font-size: 30px; }
    #top #easypage-achievement .achievement-txt { font-size: 18px; line-height: 1.8; }
    #top #easypage-achievement strong { display: block; text-align: center; margin-bottom: 30px; font-size: 22px; }
}

/*=======================================================
 News&Release カルーセル
========================================================*/
.carousel.slider { /*横幅94%で左右に余白を持たせて中央寄せ*/ width: 94%; margin: 0 auto; }

.carousel.slider img { width: 100%; /*スライダー内の画像を横幅100%に*/ height: auto; }

/*slickのJSで書かれるタグ内、スライド左右の余白調整*/

.carousel.slider .slick-slide { margin: 0 10px; }

/*矢印の設定*/

/*戻る、次へ矢印の位置*/
.carousel.slider .slick-prev,
.carousel.slider .slick-next { position: absolute; /*絶対配置にする*/ top: 35%; cursor: pointer; /*マウスカーソルを指マークに*/ outline: none; /*クリックをしたら出てくる枠線を消す*/ border-top: 2px solid #000; /*矢印の色*/ border-right: 2px solid #000; /*矢印の色*/ height: 15px; width: 15px; }

.carousel.slider .slick-prev { /*戻る矢印の位置と形状*/ left: -1.5%; transform: rotate(-135deg); }

.carousel.slider .slick-next { /*次へ矢印の位置と形状*/ right: -1.5%; transform: rotate(45deg); }

/*ドットナビゲーションの設定*/

.carousel.slider .slick-dots { text-align: center; margin: 20px 0 0 0; }

.carousel.slider .slick-dots li { display: inline-block; margin: 0 5px; }

.carousel.slider .slick-dots button { color: transparent; outline: none; width: 8px; /*ドットボタンのサイズ*/ height: 8px; /*ドットボタンのサイズ*/ display: block; border-radius: 50%; background: #ccc; /*ドットボタンの色*/ }

.carousel.slider .slick-dots .slick-active button { background: #000; /*ドットボタンの現在地表示の色*/ }