@charset "UTF-8";
/*****************
404
*****************/
.error{
	text-align: center;
}
.error h2{
	margin-bottom: 30px;
}
.error .btn_01{
	margin-top: 100px;
}
@media screen and (max-width: 568px){
.error .btn_01{
	margin-top: 50px;
}	
	
	
}

/*****************
Process
*****************/
.process .c-pageTitle{
	background-image: url("../../images/production-process/mv_bk.jpg");
}
.training{
	
}
.training li{
	position: relative;
	padding: 0 0 160px 0;
}
.training li::before{
	content: "";
	display: block;
	position: absolute;
	top: 0px;
	left: 35px;
	width: 1px;
	bottom: 0;
	background-color: rgba(228,228,228,0.70);
}
.training li:nth-child(8n)::before{background: none;}
.goal .timetable{top: -50px;z-index: 2;}


.last::before{
	display: none!important;
}
.pinkonly{
	background-color: transparent !important;
}
.round{
	width: 70px;
	height: 70px;
	-webkit-border-radius: 50%;/* 50%でもOK */
	-moz-border-radius: 50%;
	border-radius: 50%;
	color: #FFFFFF;
	font-size: 32px;
	line-height: 1.3;
	position: relative;
	padding: 5px;
}
.text_s{
	font-size: 10px;
	line-height: 1.3 ;
}
.timetable{
	position: absolute;
top: 0px;
left: 0px;
}
.round_inner{
	position: absolute;
	text-align: center;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.round_inner p{
	font-size: 22px;
  line-height: 1;
	font-weight: 900;
}
.round_inner span{
	font-size: 8px;
  letter-spacing: 0.1em;
	display: block;
}
.t_content {
  padding: 0 0 0 150px;
  text-align: left;
  line-height: 1.8;

}
.t_content dt{
	margin-bottom: 10px;
		
}
.t_content dd{
	line-height: 2.3;
	
}
.point{
	line-height: 1.8;
	text-align: left;
}

.point .product li{
	width: 29%;
	margin: 0 5% 30px 0;
}

.point .product li:nth-child(3n) {
  margin-right: 0;
}

.net_item{
	position: relative;
}
.point .product li img{
	border-radius: 5px;
}
.point .product dl{
	text-align: center;
	margin: 10px 0 0;
}
.buy_now{
	width: 55px;
	position: absolute;
	bottom: 10px;
	right: 10px;
}


.point h3{
	font-size: 24px;
	text-align: center;	
	color: #000000;
	margin: 0 0 60px;
}
.point h3::after {
  position: absolute;
  content: "";
  display: block;
  height: 1px;
  width: 80px;
  left: 0;
  right: 0;
  margin: 10px auto 0;
  border-top: 3px dotted #db1e79;
}
.point p{
font-size: 16px;
line-height: 2.2;
	margin: 0 0 50px;
	text-align: center;	
}
.training li:first-child .round,.training li:nth-child(6)  .round{
	background-color: #ec614a;
}
.training li:nth-child(2)  .round,.training li:nth-child(7)  .round{
	background-color: #f08bbd;
}
.training li:nth-child(3) .round{
	background-color: #5eb743;
}
.training li:nth-child(4)  .round{
	background-color: #f6ca24;
}
.training li:nth-child(5)  .round{
	background-color: #f59600;
}
.training li:nth-child(8)  .round{
	background-color: #5eb743;
}


.training li:last-child .round{
	background-color: #f6ca24;
	width: 120px;
	height: 120px;
	  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
/* 内側の丸 */
.training li:last-child .round .round__inner {
  width: 100px;
  height: 100px;
  background: #FFFFFF;
  border-radius: 50%;
  position: relative;
  z-index: 2;
}

/* 外側の点線リング */
.round__dotted {
  width: 120px;
  height: 120px;
  border: 4px dotted #FFFFFF;
  border-radius: 50%;
  position: absolute;
  top: 0;
  left: 0;
  box-sizing: border-box;
  animation: rotate 15s linear infinite;
}

/* 回転アニメーション */
@keyframes rotate {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.training li .box{
	display: flex;
	 flex-wrap: wrap;
	align-items: flex-start; 
	 justify-content: space-between;
	position: relative;
}
.training li .box .t_content{
	width: 60%;
}
.training li .box .right_box{
	width: 35%;
}
.training li .box .right_box img{
    border-radius: 15px;
}
.p_step_2_02{
	margin-bottom: 25px;
	width: 80%;
	border-radius: 15px;
}
.p_step_2{
	padding-left: 160px;
}
.p_step_7{padding-left: 70px;margin-bottom: 25px;}
.p_step_7_02{width: 60%;}


.tablet_01{
	position: absolute;
	bottom: -120px;
	  left: 0;
  right: 0;
  margin:0 auto;
	width: 305px;
}
.btm200{
	padding-bottom: 230px !important;
}
.inspection{
    background-color: rgba(255,255,255,0.1);
    border-radius: 10px;
	padding: 20px 30px;
	margin: 18px 0 ;
}
.inspection dl{
	margin-top: 8px;
	font-size: 14px;
	font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 400;
	letter-spacing: 0.08em;
}
.inspection dl dt{
	margin-bottom: 0;
}
.inspection dl dt::before{
    content: '◼︎';
    display: inline-block;
    margin: 0 5px 0 0;
    color: #0d9dbd;
	font-size: 18px;
}
.inspection dl dd{
	padding-left: 20px
}
.inspection dl dd::before{
    content: '⚪︎';
    display: inline-block;
    margin: 0 5px 0 0;
}
.goal{
	position: relative;
}
.goal .box{
	  background-color: rgba(255,255,255,0.1);
    border-radius: 10px;
	padding: 60px 180px 60px 100px;
	margin: 0px 50px 0 50px;
		width: 70%;
	
}
.training .goal .box .t_content {
  width: 100%;
}
.goal .t_content {
  padding: 0 0 0 0px;
}
.p_step_goal01{
	position: absolute;
	width: 320px;
	top: -50px;
	right: 100px;
}
.p_step_goal02{
		position: absolute;
	width: 320px;
	bottom: 100px;
	right: 0px;
}
.p_step_goal01 img,.p_step_goal02 img{
    border-radius: 13px;
}
.goal .c-ttl__large__text{
	font-size: 20px;
	font-weight: 500;
}
.p_step_100{
	width: 100%;
	border-radius: 15px;
}
@media screen and (max-width: 1010px) {
.p_step_goal01 {
  right: 70px;
}	
}
@media screen and (max-width: 768px) {
 .t_content {
    padding: 0 0 0 70px;
  }
 .round {
    width: 50px;
    height: 50px;
    font-size: 28px;
    padding: 5px;
  }
.round_inner p {
 font-size: 3.3333vw;
}	

.training li::before {
    left: 23px;
  }	
.training li .box .t_content{
	width: 100%;
	margin-bottom: 30px;
}
.training li .box .right_box{
	width: 100%;
	padding: 0 0 0 70px;
}
.p_step_2_02{
	margin-bottom: 25px;
	width: 100%;
}
.p_step_2{
	padding-left: 100px;
}
.goal .box {
 padding: 80px 8% 20px 8%;
    margin: 0px 0px 30px 0px;
    width: 100%;
}
.p_step_goal01 {
  position: static;
  width: 84%;

}
.p_step_goal02{
 position: static;
  width: 84%;
	margin: 30px 0 0 12%;	
	}
.goal .timetable{
	top: -60px;
  left: 0;
  right: 0;
  margin:0 auto;
width: fit-content;
	}
.goal .t_content dt {
  text-align: center;
	margin-bottom: 15px;
}
	
}
	
@media screen and (max-width: 568px){
.training li {
  padding: 0 0 60px 0;
}
.tablet_01{
	bottom: -105px;
	width: 265px;
}
.btm200 {
  padding-bottom: 160px !important;
}
.inspection dl{
	font-size: 3.0vw;
}
.goal .box {
 padding: 60px 8% 20px 8%;
}
.training li:last-child .round{
	width: 100px;
	height: 100px;
}
/* 内側の丸 */
.training li:last-child .round .round__inner {
  width: 80px;
  height: 80px;
}

/* 外側の点線リング */
.round__dotted {
  width: 100px;
  height: 100px;
}

}





/*****************
About
*****************/
.about .c-pageTitle{
	background-image: url("../../images/about/mv_bk.jpg");
}
.about_sec01{
	text-align: center;
	padding: 0 0 200px;
	position: relative;
}
.about_sec01 .title_ara{
	margin-bottom: 50px;
}
.about_sec01 .formal_font{line-height: 2.8;}

.firework_01{
	width: 150px;
	position:  absolute;
	top: 50px;
	left: 50px;
}
.sv .firework_02{
	width: 200px;
	position:  absolute;
	bottom: 100px;
	right: 0px;
	    -webkit-animation-delay: .75s;
    animation-delay: .75s !important; 
}
.sv .ff-illust {
  position: absolute;
  -webkit-animation: 4s ff ease-out infinite;
  animation: 4s ff ease-out infinite;
    animation-delay: 0s;
  -webkit-transform: translateY(80px);
  transform: translateY(80px);
  opacity: 0;
  z-index: 10;
}
@keyframes ff {
  0% {
    -webkit-transform: translateY(100px) scale(0.3);
            transform: translateY(100px) scale(0.3);
    opacity: 0; }
  45% {
    -webkit-transform: translateY(60px) scale(0.3);
            transform: translateY(60px) scale(0.3);
    opacity: 0; }
  75% {
    -webkit-transform: translateY(0) scale(1);
            transform: translateY(0) scale(1);
    opacity: 100; }
  76% {
    -webkit-transform: translateY(0) scale(1);
            transform: translateY(0) scale(1);
    opacity: 90; }
  100% {
    -webkit-transform: translateY(0) scale(1.3);
            transform: translateY(0) scale(1.3);
    opacity: 0; } }
@-webkit-keyframes ff {
  0% {
    -webkit-transform: translateY(100px) scale(0.3);
            transform: translateY(100px) scale(0.3);
    opacity: 0; }
  40% {
    -webkit-transform: translateY(50px) scale(0.3);
            transform: translateY(50px) scale(0.3);
    opacity: 0; }
  85% {
    -webkit-transform: translateY(0) scale(1);
            transform: translateY(0) scale(1);
    opacity: 100; }
  100% {
    -webkit-transform: translateY(0) scale(1.1);
            transform: translateY(0) scale(1.1);
    opacity: 0; } }

.about_sec02{
	position: relative;
	padding: 150px 0 150px;
}
.about_sec02::before {
  width: 100%;
  max-width: 1560px;
  height: 100%;
  content: "";
  display: block;
  position: absolute;
  top: 0px;
  right: 50%;
  background-color: rgba(255,255,255,0.15);
  border-radius: 700px;
  z-index: 0;
  translate: 50% 0%;
}
.color_spray_image{
	width: 330px;
	margin: auto;
	position: absolute;
	top: -100px;
	  left: 0;
  right: 0;
}
.Contribute-Section {
  padding: 0 40px;
	margin-bottom: 130px;
}
.Contribute-Section__inner {
  margin: 73px auto 0;
  padding-bottom: 56px;
  position: relative;
  width: min(100%, 1060px);
  z-index: 0
}


.Contribute-Section__inner:before {
  border-radius: 10px;
  bottom: 0;
  content: "";
  display: block;
  left: clamp(60px, 90/1214*100vw, 90px);
  position: absolute;
  right: 0;
  top: 124px;
  z-index: -1
}
.point_01 .Contribute-Section__inner:before,.point_01 .Contribute-Section__title .icon,.point_01 .Contribute-Section__title .icon:after {background: #ec614a;}
.point_02 .Contribute-Section__inner:before,.point_02 .Contribute-Section__title .icon,.point_02 .Contribute-Section__title .icon:after  {background: #f08bbd;}

.point_03 .Contribute-Section__inner:before,.point_03 .Contribute-Section__title .icon,.point_03 .Contribute-Section__title .icon:after  {background: #5eb743;}
.point_04 .Contribute-Section__inner:before,.point_04 .Contribute-Section__title .icon,.point_04 .Contribute-Section__title .icon:after {background: #f59600;}
.point_05 .Contribute-Section__inner:before,.point_05 .Contribute-Section__title .icon,.point_05 .Contribute-Section__title .icon:after {background: #f6ca24;}

.Contribute-Section__header {
  display: flex;
  flex-direction: row-reverse;
  padding: 58px 0 0
}

.Contribute-Section__image {
  border-radius: 10px;
  flex: 0 0 auto;
  overflow: hidden;
  width: min(795px, 76%)
}

.Contribute-Section__title {
  display: flex;
  flex: 0 0 auto;
  justify-content: center;
  margin: 0 auto;
  position: relative
}

.Contribute-Section__title .text {
  font-size: 28px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 700;
  line-height: 1.7;
  color: #FFFFFF;
  letter-spacing: 0.08em;
  writing-mode: vertical-rl;
}

.Contribute-Section__title .icon {
  align-items: center;
  aspect-ratio: 1;
  border-radius: 100vw;
  display: flex;
  flex-direction: column;
  font-weight: 900;
  height: auto;
  justify-content: center;
  left: 100%;
  line-height: 1;
  position: absolute;
  text-align: center;
  top: -58px;
  width: 73px
}

.Contribute-Section__title .icon:after {
  bottom: 0;
  clip-path: polygon(50% 100%, 0 0, 100% 0);
  content: "";
  display: block;
  height: 13px;
  left: 0;
  position: absolute;
  rotate: 40deg;
  transform-origin: center bottom;
  width: 10px
}

.Contribute-Section__title .icon .en {
  font-size: 8px;
  letter-spacing: .1em
}

.Contribute-Section__title .icon .number {
  font-size: 22px;
 line-height: 1;
	
}

.Contribute-Section__body {
  align-items: center;
  display: flex;
  flex-direction: row-reverse;
  gap: clamp(20px, 50/1214*100vw, 50px);
  margin: 37px 0 0
}

.Contribute-Section__images {
  display: flex;
  flex: 0 0 auto;
  gap: 20px;
  width: min(610px, 58%)
}

.point_02 .Contribute-Section__images,.point_04 .Contribute-Section__images{
  width: min(310px, 48%);
}

.Contribute-Section__images>figure {
  border-radius: 10px;
  flex: 1 1 auto;
  overflow: hidden;
  width: 100%
}

.Contribute-Section__text {
  flex: 1 1 auto;
  letter-spacing: .1em;
  line-height: 2;
  padding-right: clamp(40px, 70/1214*100vw, 70px);
  text-align: justify
}
.point_03 .box{
	align-items: center;
  display: flex;
  margin: 27px 0 0;
}	
.point_03 .box .Contribute-Section__text {
  padding-left: 150px;
  padding-right: 80px;
  max-width: 850px;
}
.point_03 .box .Contribute-Section__images {
  width: min(380px, 48%);
	padding-right: clamp(100px, 100/1884*100vw, 350px);
}
.top_50{
	margin-top: 100px;
}
.last_text{
	padding-left: 170px;
	padding-right: 100px;
	text-align: justify;
	letter-spacing: .1em;
  line-height: 2;
	margin-top: 37px;
}
@media screen and (min-width:768px) {
  .Works-Section__title+p {
    letter-spacing: .1em;
    line-height: 2
  }

  .Contribute-Section:nth-of-type(2n) .Contribute-Section__inner:before {
    left: 0;
    right: clamp(60px, 90/1214*100vw, 90px)
  }

  .Contribute-Section:nth-of-type(2n) .Contribute-Section__header {
    flex-direction: row
  }

  .Contribute-Section:nth-of-type(2n) .Contribute-Section__title .icon {
    left: auto;
    right: 100%
  }

  .Contribute-Section:nth-of-type(2n) .Contribute-Section__title .icon:after {
    left: auto;
    right: 0;
    rotate: -40deg
  }

  .Contribute-Section:nth-of-type(2n) .Contribute-Section__body {
    flex-direction: row
  }

  .Contribute-Section:nth-of-type(2n) .Contribute-Section__text {
    padding-left: clamp(40px, 70/1214*100vw, 70px);
    padding-right: 0
  }
 }

@media screen and (max-width: 768px) {
.firework_01{
	width: 100px;
	top: 0px;
	left: 0px;
}
.sv .firework_02{
	width: 100px;
	bottom: 100px;
	right: 0px;
}
.color_spray_image {
  width: 230px;
  top: -100px;
}
.about_sec02::before {
	border-radius: 700px 700px 0px 0px;
}	
.about_sec02 {
  padding: 50px 0 0px;
}	
.p-front-news__inner__head{
	margin-bottom: 50px;	
	}	

  .Contribute-Section {
    padding: 0 8.9743vw
  }

  .Contribute-Section__inner {
    margin: 17.9487vw 0 0;
    padding-bottom: 9.2307vw;
    width: 100%
  }

  .Contribute-Section__inner:before {
    border-radius: 0;
    left: -8.9744vw;
    right: -8.9744vw;
    top: 10.2564vw
  }

  .Contribute-Section__header {
    flex-direction: column-reverse;
    gap: 5.1282vw;
    padding: 0
  }

  .Contribute-Section__image {
    border-radius: 1.0256vw;
    width: 100%
  }

  .Contribute-Section__title {
    display: block;
	margin: 20px auto;
	  padding: 10px 0 0;
  }

  .Contribute-Section__title .text {
    font-size: 4.6153vw;
    writing-mode: initial
  }

  .Contribute-Section__title .icon {
	left: 50%;
	margin-left: -4.359vw;
	top: -8.718vw;
	width: 8.7179vw;
	background-color: #000000 !important;	  
  }

  .Contribute-Section__title .icon:after {
    bottom: -1.0257vw;
    height: 1.5384vw;
    left: 50%;
    margin-left: -.3847vw;
    rotate: 0deg;
    width: .7692vw;
	  background-color: #000000 !important;	
  }

  .Contribute-Section__title .icon .en {
    font-size: 1.282vw
  }

  .Contribute-Section__title .icon .number {
    font-size: 3.3333vw
  }

  .Contribute-Section__body {
    display: block;
    margin: 0
  }

  .Contribute-Section__images {
    gap: 1.5384vw;
    margin-top: 4.1025vw;
    width: 100%
  }

  .Contribute-Section__images>figure {
    border-radius: 1.0256vw
  }

  .Contribute-Section__text {
    letter-spacing: .04em;
    padding-right: 0
  }	
.point_03 .box{
  display: block;
}	
.point_03 .box .Contribute-Section__text {
  padding-left: 0;
  padding-right: 0px;
  max-width: 100%
}
.point_03 .box .Contribute-Section__images {
width: min(310px, 48%);
	padding-right: 0;
}	
.top_50 {
  margin-top: 0px;
}
.Contribute-Section {
	margin-bottom: 30px;
}
.last_text {
  padding-left: 0px;
  padding-right: 0px;
  text-align: justify;
  letter-spacing: .1em;
  line-height: 2;
  margin-top: 0px;
}
}
	


	
	
	
@media screen and (max-width: 568px){
.about_sec01 {
  padding: 0 0 100px;
}
.about_sec01 .text_ara{
	text-align: left;
}
.firework_01{
	width: 80px;
	top: -60px;
	left: 0px;
}
.sv .firework_02{
	width: 90px;
	bottom: 40px;
	right: 0px;
}
.color_spray_image {
    width: 180px;
    top: -50px;
 }
}
		
/*****************
company
*****************/
.company .c-pageTitle{
	background-image: url("../../images/company/mv_bk.jpg");
}
.company_sec01{
	margin-bottom: 80px;
}
.company_sec01 .title_ara,.company_sec02 .title_ara,.company_sec03 .title_ara{
	text-align: center;
	margin-bottom: 40px;
}
.company_sec01 .text_ara{
	max-width: 900px;
	margin: 0 auto 50px;
}
.company_sec01 .text_ara h3{
	text-align: center;
	margin-bottom: 60px;
	line-height: 1.8;
}
.company_sec01 .text_ara .formal_font{
	line-height: 2.6;
	margin-bottom: 30px
}
.ceo{
	text-align: right;
	max-width: 900px;
	margin: auto;
}
.ceo dt{
	font-size: 17px;
	font-weight: 500;
	letter-spacing: 0.08em;
}
.ceo dd{
	font-size: 28px;
	letter-spacing: 0.08em;
	 font-family: "Zen Old Mincho", serif;
  font-weight: 600;
  font-style: normal;
}
.company_sec02{
    padding: 150px 0 200px;
}
.info-list_02{
		max-width: 900px;
	margin: 0px auto 50px;
}

.info-list_02 .item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 25px 0;
	border-bottom: 1px solid #85766a;
}
.info-list_02 dt,.info-list_03 dt {
  padding: 0 20px;
  width: 220px;
	font-weight: 500;
  letter-spacing: .1em;
}

.info-list_02 dd,.info-list_03 dd {
  width: calc(100% - 220px);
	font-weight: 500;
  letter-spacing: .1em;
}
.g_map{	
	max-width: 900px;
	margin: auto;
	
}
.company_sec03{
	padding-bottom: 150px;
}
.info-list_03 .item {
	display: flex;
	align-items: flex-start;
	padding: 25px 0;
	max-width: 700px;
	margin: auto;
}
.info-list_03 dt {
  padding: 0 20px;
  width: 120px;
	font-weight: 500;
  letter-spacing: .1em;
}

.info-list_03 dd {
  width: calc(100% - 120px);
	font-weight: 500;
  letter-spacing: .1em;
}
.page .sliding {
mix-blend-mode: normal;
	filter: brightness(0.7);
}
@media screen and (max-width: 768px) {
.company .c-pageTitle{
	background-position: center right -130px;
}	
.company_sec02,.company_sec03{
    background-color: #1c120d;
	position: relative;
	z-index: 1;
	}
.company_sec03{
	padding-bottom: 50px;
}
}
@media screen and (max-width: 568px){
.company_sec01 .title_ara{
	margin-bottom: 20px;
}
.company_sec01 .text_ara h3{
	margin-bottom: 30px;
}
.ceo dt{
	font-size: 14px;
}
.ceo dd{
	font-size: 26px;
}
.company_sec02 {
  padding: 80px 0 100px;
	border-top-right-radius: 100px;
  border-top-left-radius: 100px;
}
.info-list_02 dt {
    padding-left: 0;
    width: 100px;
  }
.info-list_02 dd {
    width: calc(100% - 100px);
  }	
.info-list_03 .item {
	padding: 10px 0;
}	
}
.picture-book {
  position: sticky;
  top: 0;
  z-index: var(--z-index-back);
}
@media (min-width: 769px) {
  .picture-book {
    position: relative;
    min-block-size: 560px;
    background-image: url(../../images/company/company_bk.jpg);
    background-position: center top;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    border-bottom-right-radius: 100px;
    border-bottom-left-radius: 100px;
  }
.picture-book::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.4); 
  z-index: 1;
	 border-bottom-right-radius: 100px;
    border-bottom-left-radius: 100px;
}
}

.picture-book__img {
	inline-size: 100%;
	block-size: auto;
	min-block-size: 560px;
	object-fit: cover;
	filter: brightness(0.7);
}

@media (min-width: 769px) {
  .picture-book__img {
    display: none;
  }
}

@media screen and (max-width: 568px){
.picture-book__img {

}
}
/*****************
NEWS
*****************/
.blog .page{
  padding: 250px 0 ;
}
.blog_h2 {
  line-height: 1.2;
  font-size: 40px;
  font-family: "Montserrat", "Noto Sans JP", "Hiragino Kaku Gothic Pro", "Hiragino Sans", "Yu Gothic", YuGothic, "Yu Mincho", "Meiryo", "Roboto", sans-serif;
  font-weight: 600;
	letter-spacing: 0.08em;
}
.blog .time{
	letter-spacing: .1em;
	font-size: 16px;
	font-weight: 500;
	margin-bottom: 10px;
	display: block;
}
.blog .title_ara{
	  border-bottom: 1px solid #85766a;
  padding: 0 0 25px;
	margin-bottom: 45px;
}
.blog .btn_01{
	margin: 180px auto 0;
}
.blog .btn_01 p{
	text-align: center;
}
.news .c-pageTitle{
	background-image: url("../../images/news/mv_bk.jpg");
}
.info-list {
	margin-bottom: 100px;
}
.info-list .item {
  display: flex;
  align-items: center;
  border-bottom: 1px solid #85766a;
  padding: 25px 0;
  position: relative; /* 基準点をつくる！ */
}
.info-list .item:first-of-type{
	padding: 0 0 25px;
}
.info-list .item dt {
  position: relative;
  padding-bottom: 0; /* 余白は消す */
}

.info-list .item dt::after {
  content: '';
  position: absolute;
  left:0;
  bottom: -29px; /* ← これで下線に重ねる */
  width: 180px;
  height: 1px;
  background-color: #FFFFFF;
}
.info-list dt {
  padding: 0 20px;
  width: 220px;
	letter-spacing: .1em;
  font-size: 13px;
	font-weight: 500;
}
.info-list dd {
  width: calc(100% - 220px);
}
.info-list dd a{
		font-weight: 500;
  font-size: 16px;
  letter-spacing: .1em;
	display: block;
	color: #FFFFFF;
}
@media screen and (max-width: 768px) {
.blog .page{
  padding: 200px 0 100px;
}	
.blog_h2 {
  font-size: 30px;
}	
.blog .btn_01{
	margin: 100px auto 0;
}	
.info-list .item {
  display: block;
  border-bottom: 1px solid #85766a;
  padding: 25px 0;
}
.info-list .item dt::after {
 display: none;
}	
.info-list dt {
  width: 100%;
padding: 0;
}
.info-list dd {
   width: 100%;
}	
}
@media screen and (max-width: 568px){
.blog .btn_01{
	margin: 90px auto 0;
}	
}


/*
ページネーション
*/
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important; 
}
.screen-reader-text:focus {
	background-color: #eee;
	clip: auto !important;
	clip-path: none;
	color: #444;
	display: block;
	font-size: 1em;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
	/* Above WP toolbar. */
}
.pagination{
	text-align: center;
	padding: 50px auto 50px;
}
.page-numbers {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.page-numbers li .current {
  background: #f6ca24;
	  width: 3rem;
  height: 3rem;
  border-radius: 50%;
	color: #000000;
}
.page-numbers li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.page-numbers li a {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
	 width: 3rem;
  height: 3rem;
color: #FFFFFF;
 
}

.shoptime__note {
	width: 50%;
}

@media screen and (max-width: 768px) {
	.shoptime__note {
	width: 100%;
}
}


/*****************
item
*****************/
.item .c-pageTitle{
	background-image: url(../../images/item/mv_bk.jpg);
}
.item_sec01{
	margin-bottom: 80px;
}
.item_list{
	display: flex;
  align-items: flex-start;
  justify-content: space-between;
	flex-wrap: wrap;
	
}
.item_list li{
	width: 45%;
	text-align: center;
	margin-bottom: 45px;
}
.item_list li figure img{
	border-radius: 10px;
}
.c-figure__cap{
	margin-top: 15px;
}
@media screen and (max-width: 768px) {
.item_list li{
	width: 48%;
	margin-bottom: 35px;
}	
.item_sec01 {
  margin-bottom: 50px;
}	
}
@media screen and (max-width: 568px){
.item_list .formal_font{
	font-size: 3.2vw;
}	
}

/*****************
TOP 
*****************/

/* TOP_動画 */
.c-bg-movie {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: -2;
  background-color: #000
}

.c-bg-movie__video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .5
}

.c-bg-movie-area {
  position: relative;
  overflow: hidden
}

.c-bg-movie-area:has(.c-bg-particles) {
  overflow: visible
}

.c-bg-movie-area__video {
  width: 162%;
  height: auto;
  position: absolute;
  top: 0;
  right: -2%
}

@media screen and (max-width: 568px) {
  .c-bg-movie-area__video {
    width: 350%;
    right: -29%
  }
}


.p-front-kv {
  width: 100%;
  height: calc(100vh - 68px);
  position: relative
}

@media screen and (max-width: 768px) {
  .p-front-kv {
    height: calc(100vh - 60px)
  }
}

.p-front-kv__inner {
  width: 100%;
  height: 100%;
  position: fixed;
  left: 0;
  height: calc(100vh - 68px);
  top: 68px;
  z-index: -1
}

@media screen and (max-width: 768px) {
  .p-front-kv__inner {
    height: calc(100vh - 60px);
    top: 60px
  }
}

.p-front-kv__content {
  position: absolute;
  left: max(calc(50% - 525px), 10%);
  top: calc(65vh - 67px - 30px);
  translate: 0 -50%;
  color: #fff
}

@media screen and (max-width: 768px) {
  .p-front-kv__content {
    max-width: none;
    left: 5%;
    top: calc(50vh - 60px - 10px)
  }
}

.p-front-kv__content__copy {
  line-height: 1.5;
  font-size: 71px;
  font-weight: bold;
  letter-spacing: .05em
}

.p-front-kv__content__copy__line {
  line-height: 1.5;
  display: block
}

.p-front-kv__content__copy__bg {
  background-color: #fff;
  color: #000;
  font-size: 78px;
  line-height: .9em;
  display: inline-block;
  padding: 0 .1em;
  margin: 0 .05em
}

.p-front-kv__content__copy__bg.--ai {
  margin-right: .1em
}

@media screen and (max-width: 1050px) {
  .p-front-kv__content__copy {
    font-size: 7vw
  }

  .p-front-kv__content__copy__bg {
    font-size: 7.8vw
  }
}

@media screen and (max-width: 768px) {
  .p-front-kv__content__copy {
    font-size: 7.7vw
  }

  .p-front-kv__content__copy__bg {
    font-size: 10vw
  }
}

@media screen and (max-width: 568px) {
  .p-front-kv__content__copy {
    font-size: 8vw
  }

  .p-front-kv__content__copy__bg {
    font-size: 12vw
  }
}

.p-front-kv__content__copy-sub {
  line-height: 1.9;
  margin-top: 1em
}

@media screen and (max-width: 768px) {
  .p-front-kv__content__copy-sub {
    font-size: 14px
  }
}

@media screen and (max-width: 568px) {
  .p-front-kv__content__copy-sub {
    font-size: 13px
  }
}

.p-front-kv__content__border {
  width: 60px;
  height: 4px;
  background-color: #fff;
  margin-top: 50px
}

@media screen and (max-width: 568px) {
  .p-front-kv__content__border {
    width: 50px;
    margin-top: 40px
  }
}

.p-front-kv__scroll {
  position: absolute;
  right: 3%;
  bottom: 15px;
  padding-bottom: 115px;
  width: 1px
}

@media screen and (max-width: 768px) {
  .p-front-kv__scroll {
    right: 5%;
    padding-bottom: 60px
  }
}

.p-front-kv__scroll__label {
  color: #fff;
  font-size: 15px;
  rotate: -90deg;
  display: block;
  transform-origin: left;
  white-space: nowrap
}

@media screen and (max-width: 768px) {
  .p-front-kv__scroll__label {
    font-size: 13px
  }
}

@media screen and (max-width: 568px) {
  .p-front-kv__scroll__label {
    font-size: 12px
  }
}

.p-front-kv__scroll:before,
.p-front-kv__scroll:after {
  content: "";
  display: block;
  background-color: #fff;
  position: absolute;
  left: 0
}

.p-front-kv__scroll:before {
  height: 120px;
  width: 1px;
  bottom: 0
}

@media screen and (max-width: 768px) {
  .p-front-kv__scroll:before {
    height: 64px
  }
}

.p-front-kv__scroll:after {
  width: 1px;
  height: 10px;
  bottom: 0;
  rotate: -30deg;
  transform-origin: bottom
}

.js-front .p-front-kv__content__copy__line {
  mask-image: linear-gradient(90deg, black 47%, rgba(0, 0, 0, 0) 53%);
  mask-size: 230% 100%;
  mask-position: 100% center;
  translate: -10%
}

@media screen and (max-width: 768px) {
  .js-front .p-front-kv__content__copy__line {
    translate: -5vw
  }
}

.js-front .p-front-kv__content__copy-sub,
.js-front .p-front-kv__content__border {
  translate: 0 50px;
  opacity: 0
}

.js-front .l-header,
.js-front .p-front-kv__scroll {
  opacity: 0
}

.js-front.is-loaded .p-front-kv__content__copy__line {
  mask-position: 0% center;
  translate: 0%
}

.js-front.is-loaded .p-front-kv__content__copy__line.--01 {
  transition: mask-position 2000ms cubic-bezier(0.75, -0.01, 0.37, 1) 0ms, translate 1333.3333333333ms cubic-bezier(0.75, -0.01, 0.37, 1) 0ms
}

.js-front.is-loaded .p-front-kv__content__copy__line.--02 {
  transition: mask-position 2000ms cubic-bezier(0.75, -0.01, 0.37, 1) 300ms, translate 1333.3333333333ms cubic-bezier(0.75, -0.01, 0.37, 1) 300ms
}

.js-front.is-loaded .p-front-kv__content__copy__line.--03 {
  transition: mask-position 2000ms cubic-bezier(0.75, -0.01, 0.37, 1) 600ms, translate 1333.3333333333ms cubic-bezier(0.75, -0.01, 0.37, 1) 600ms
}

@media screen and (max-width: 768px) {
  .js-front.is-loaded .p-front-kv__content__copy__line.--01 {
    transition: mask-position 1400ms cubic-bezier(0.75, -0.01, 0.37, 1) 0ms, translate 933.3333333333ms cubic-bezier(0.75, -0.01, 0.37, 1) 0ms
  }

  .js-front.is-loaded .p-front-kv__content__copy__line.--02 {
    transition: mask-position 1400ms cubic-bezier(0.75, -0.01, 0.37, 1) 200ms, translate 933.3333333333ms cubic-bezier(0.75, -0.01, 0.37, 1) 200ms
  }

  .js-front.is-loaded .p-front-kv__content__copy__line.--03 {
    transition: mask-position 1400ms cubic-bezier(0.75, -0.01, 0.37, 1) 400ms, translate 933.3333333333ms cubic-bezier(0.75, -0.01, 0.37, 1) 400ms
  }
}

.js-front.is-loaded .p-front-kv__content__copy-sub,
.js-front.is-loaded .p-front-kv__content__border {
  translate: 0 0;
  opacity: 1;
  transition: translate 700ms ease-out 1800ms, opacity 700ms ease-in 1800ms
}

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

  .js-front.is-loaded .p-front-kv__content__copy-sub,
  .js-front.is-loaded .p-front-kv__content__border {
    transition: translate 700ms ease-out 1300ms, opacity 700ms ease-in 1300ms
  }
}

.js-front.is-loaded .l-header {
  opacity: 1;
  transition: opacity 1000ms ease 1800ms
}

@media screen and (max-width: 768px) {
  .js-front.is-loaded .l-header {
    transition: opacity 1000ms ease 1300ms
  }
}

.js-front.is-loaded .p-front-kv__scroll {
  opacity: 1;
  transition: opacity 1000ms ease 2500ms
}

@media screen and (max-width: 768px) {
  .js-front.is-loaded .p-front-kv__scroll {
    transition: opacity 1000ms ease 2000ms
  }
}


/* 安心・安全を、彩りとともに。 */
.p-front-about {
  position: relative;
  z-index: 1;
  color: #fff;
  padding: 150px 0 200px;
	  
}

@media screen and (max-width: 768px) {
  .p-front-about {
    padding-top: 80px
  }
}

.p-front-about__bg {
  position: absolute;
  top: 0;
  left: 50%;
  width: 100%;
  height: 100%;
  width: 95%;
  translate: -50%;
  border-radius: 80px 80px 0 0;
  z-index: -1
}

@media screen and (max-width: 768px) {
  .p-front-about__bg {
    border-radius: 60px 60px 0 0
  }
}

@media screen and (max-width: 568px) {
  .p-front-about__bg {
    border-radius: 50px 50px 0 0
  }
}

.p-front-about__inner__text__copy {
  font-size: 36px;
  font-weight: bold;
  letter-spacing: .1em;
  margin: 10px 0 20px;
  line-height: 1.5
}

@media screen and (max-width: 768px) {
  .p-front-about__inner__text__copy {
    font-size: 25px;
    margin: 20px 0
  }
}

@media screen and (max-width: 568px) {
  .p-front-about__inner__text__copy {
    font-size: 22px
  }
}

@media screen and (max-width: 374px) {
  .p-front-about__inner__text__copy {
    font-size: 20px
  }
}

.p-front-about__inner__text__body {
  font-weight: bold;
  letter-spacing: .1em;
  line-height: 2.8
}

.p-front-about__inner__text__body p {
  line-height: 2.8
}

@media screen and (max-width: 768px) {
  .p-front-about__inner__text__body {
    font-size: 14px
  }
}

@media screen and (max-width: 568px) {
  .p-front-about__inner__text__body {
    font-size: 3.2vw
  }
}

@media screen and (max-width: 414px) {
  .p-front-about__inner__text__body {
    font-size: 3.7vw
  }
}

.p-front-about__inner__text__body__line.--pt1em {
  padding-top: 2.8em
}

.p-front-about__inner__gallery__img {
  width: 100%;
  height: auto;
	border-radius: 10px;
}

@media screen and (min-width: 769px) {
  .p-front-about__inner {
    display: flex;
    align-items: center;
    justify-content: space-between
  }

  .p-front-about__inner__text {
    width: 550px;
		order: 2;
  }

  .p-front-about__inner__gallery {
	width: 464px;
	max-width: calc(100% - 630px);
	order: 1;
	
  }
}

@media screen and (max-width: 768px) {
  .p-front-about__inner__gallery {
    margin-top: 50px
  }
}

.c-ttl {
  line-height: 1.2
}

.c-ttl__small {
  line-height: 1.2;
  font-size: 24px;
  letter-spacing: .1em;
  font-weight: bold
}

.c-ttl__small__text {
  line-height: 1.2;
  color: #FFFFFF;
  background-clip: text;
}

@media screen and (max-width: 768px) {
  .c-ttl__small {
    font-size: 20px
  }
}

@media screen and (max-width: 568px) {
  .c-ttl__small {
    font-size: 18px
  }
}

.c-ttl__small+.c-ttl__large {
  margin-top: 5px
}

.c-ttl__large {
  line-height: 1.2;
  font-size: 68px;
	font-family: "Montserrat","Noto Sans JP","Hiragino Kaku Gothic Pro","Hiragino Sans","Yu Gothic",YuGothic,"Yu Mincho","Meiryo","Roboto",sans-serif;	
	font-weight: 600;
}
.c-ttl__middle {
  line-height: 1.2;
  font-size: 48px;
	font-family: "Montserrat","Noto Sans JP","Hiragino Kaku Gothic Pro","Hiragino Sans","Yu Gothic",YuGothic,"Yu Mincho","Meiryo","Roboto",sans-serif;	
	font-weight: 600;
}

.c-ttl__large__text {
  line-height: 1.2;
  color: rgba(0, 0, 0, 0);
  background-clip: text;
  background-image: linear-gradient(90deg, #001DA0, #001DA0)
}

@media screen and (max-width: 768px) {
  .c-ttl__large {
    font-size: 52px;
  }
.c-ttl__middle {
  font-size: 40px;
}
}

@media screen and (max-width: 568px) {
  .c-ttl__large {
    font-size: 40px
  }
.c-ttl__middle {
  font-size: 32px;
}
}

@media screen and (max-width: 374px) {
  .c-ttl__large {
    font-size: 40px
  }
}

.c-ttl.--white .c-ttl__small__text {
  background-image: none;
  background-color: #fff
}

.c-ttl.--white .c-ttl__large__text {
  background-image: none;
  background-color: #fff
}

.c-ttl.--medium .c-ttl__large {
  font-size: 66px
}

@media screen and (max-width: 768px) {
  .c-ttl.--medium .c-ttl__large {
    font-size: 42px
  }
}

@media screen and (max-width: 568px) {
  .c-ttl.--medium .c-ttl__large {
    font-size: 32px
  }
}


.c-ttl-effect {
  mask-image: linear-gradient(90deg, black 28%, rgba(0, 0, 0, 0.2) 30%, rgba(0, 0, 0, 0.2) 70%, rgba(0, 0, 0, 0) 72%, rgba(0, 0, 0, 0) 100%);
  mask-size: 370% 100%;
  mask-position: 100% center;
  transition: mask-position 1s cubic-bezier(0.61, 0.03, 0.18, 1.04)
}

.c-ttl-effect.is-show {
  mask-position: 0% center
}

.c-ttl-effect-grad {
  background-image: linear-gradient(
    90deg,
    #e54a3a 0%,
    #ea73af 20%,
	  #168caf 30%,
    #4fad34 40%,
    #f3c11d 60%,
    #f08300 80%
    
  ) !important;
  background-position: 100% center;
  background-size: 320% 100%;
  transition: background-position 0.5s cubic-bezier(0.61, 0.03, 0.18, 1.04)
}


@keyframes colorful-grad {
  0% {
    background-position: 100% center;
  }
  50% {
    background-position: 0% center;
  }
  100% {
    background-position: 100% center;
  }
}

.c-ttl-effect-grad.is-show {
  background-position: 35% center
}
.c-ttl-effect-grad.is-show.is-moving {
  animation: grad-moving 10s ease-in-out infinite
}

@keyframes grad-moving {
  0% {
    background-position: 35% center
  }

  50% {
    background-position: 0% center
  }

  100% {
    background-position: 35% center
  }
}
.p-front-about .sec_01{
	position: relative;
}
.p-front-about .sec_02{
	margin: 80px 0;
}
.p-front-about .sec_02 .box_right{
	width: 55%;
	position: relative;
}
.p-front-about .sec_02 .box_left{
	width: 37%;
	position: relative;
}
.p-front-about .sec_03{
	text-align: center;
	position: relative;
}
.p-front-about .sec_03 span{
	font-size: 30px;
	display: block;
}
.p-front-about .sec_03 .btn_01{
	margin-top: 80px;
}
.top_about_04{
	position: absolute;
	top: 40px;
	left: 0;
	width: 245px
}
.top_about_03{
	position: absolute;
	bottom: -80px;
	right: 0;
	width: 222px;
}
.top_about_04 img,.top_about_03 img{
	border-radius: 10px;
}
.color_spray{
	width: 80px;
	position: absolute;
	top: -70px;
	right: -20px;
	
}
.color_spray_01{
	width: 50px;
  position: absolute;
  bottom: -80px;
  left: -80px;
}
.color_spray_03{
	width: 100px;
	position: absolute;
	top: -40px;
	left: -30px;
}

/* スプレーチョコの製造工程。 */
.c-bg-particles {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: -1;
  
  overflow: hidden;
	
}
.c-bg-movie-area::before{
	background: #1c120d;
	height: 100%;
  content: "";
  display: block;
	  position: absolute;
	top: 0px;
  left: 0;
  z-index: -2;
	width: 100%;
	
}
.c-bg-particles__particles {
  position: absolute;
  width: 70%;
  height: 100%;
  left: 60%;
  top: 0
}
.js-bg-particles-area .c-bg-particles {
  height: 100vh
}
.c-type .c-type__line {
  display: block
}


.c-type .c-type__line__char {
  opacity: .2
}







/* TOP_お知らせ */
.p-front-news {
  padding-top: 150px;
  padding-bottom: 150px;
  background-color: #fff;
  position: relative;
  z-index: 1
}

.p-front-news__btn {
  margin-top: 40px
}

@media screen and (max-width: 768px) {
  .p-front-news {
    padding-top: 70px;
    padding-bottom: 70px
  }

  .p-front-news__btn {
    margin-top: 30px
  }
}

@media screen and (min-width: 769px) {
  .p-front-news__inner {
    display: flex
  }

  .p-front-news__inner__head {
    margin-right: 70px;
	  position: relative;
  }

  .p-front-news__inner__list {
    flex: 1
  }
}


.c-articleList.textend_dots h2,
.c-articleList.textend_dots h3 {
  overflow: hidden;
  max-height: 1.9em;
  line-height: 1.9em
}

.c-articleList.textend_dots h2 .textline,
.c-articleList.textend_dots h3 .textline {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  line-height: 1.9em
}

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

  .c-articleList.textend_dots h2,
  .c-articleList.textend_dots h3 {
    max-height: 5.7em
  }

  .c-articleList.textend_dots h2 .textline,
  .c-articleList.textend_dots h3 .textline {
    -webkit-line-clamp: 3
  }
}

.c-articleList.textend_grad h2 a,
.c-articleList.textend_grad h3 a {
  height: 1.8em;
  overflow: hidden;
  display: block;
  position: relative
}



.c-articleList .c-articleList__item {
	display: flex;
	align-items: center;
}
.c-articleList a{
	background-color: #F6F7F7;
	padding: 25px 90px 25px 30px;
	display: inline-block;
	width: 100%;
	border-radius: 10px;
	margin-bottom: 15px;
		background-size: 18px auto;
	background-position: right 50px center;
	background-image: url(../../assets/images/icon_arrow.png);
}
.c-articleList a:hover{
	color: #FFFFFF;
	background-size: 18px auto;
	background-position: right 50px center;
	background-image: url(../../assets/images/icon_arrow_w.png);
	background-color: #2d2316;
}




@media screen and (max-width: 768px) {
  .c-articleList .c-articleList__item {
    flex-wrap: wrap;
    padding-right: 0;
    background-position: right 10px top 27px
  }
}

.c-articleList .c-articleList__date {
  width: 115px;
  padding: 0 10px 0 0;
  letter-spacing: .1em;
	font-size: 13px;
}

@media screen and (max-width: 768px) {
  .c-articleList .c-articleList__date {
    width: auto
  }
}

.c-articleList .c-articleList__cat {
  margin-right: 20px;
  display: block
}



@media screen and (max-width: 768px) {
  .c-articleList .c-articleList__cat {
    width: auto
  }
}

.c-articleList .c-articleList__ttl {
  flex: 1;
  font-weight: 500;
  font-size: 16px;
  letter-spacing: .1em
}


@media screen and (max-width: 768px) {
  .c-articleList .c-articleList__ttl {
    flex: auto;
    width: 100%;
    margin-top: 10px
  }
}


/* TOP_会社案内 */
.p-front-product .p-front-product__inner {
  padding-top: 200px;
  padding-bottom: 240px;
  width: 100%;
}

@media screen and (max-width: 768px) {
  .p-front-product .p-front-product__inner {
    padding-top: 80px;
    padding-bottom: 100px
  }
}

.p-front-product__slider {
  max-width: 1166px;
  width: 90%;
  margin: 0 auto
}
@media screen and (max-width: 768px) {
  .p-front-product__slider__wrapper {
    gap: 0 20px
  }
}

.u-hide {
  display: none
}

@media screen and (max-width: 768px) {
  .u-hideSp {
    display: none
  }
}

@media screen and (min-width: 769px) {
  .u-hidePc {
    display: none
  }
}

.u-textCenter {
  text-align: center
}

.top_service{
	position: relative;
	padding: 150px 0 200px;
}
.top_service::before {
	width: 100%;
	max-width: 1560px;
	height: 100%;
	content: "";
	display: block;
	position: absolute;
	top: 0px;
	right: 50%;
	background-color: rgba(255,255,255,0.15);
	border-radius: 700px;
	z-index: 0;
	translate: 50% 0%;
}
.top_service .l-wrapper{
	position: relative;
}
.color_spray_02{
	position: absolute;
	top: -150px;
	 right: calc(50% + 150px);
	width: 50px;
	
}
.top_service .title_ara{
	margin-bottom: 80px;
	color: #FFFFFF;
	text-align: center;
}
.top_service .title_ara .c-ttl__large span{
	font-size: 20px;
	display: block;
}
.top-service_list .box{
	border-radius: 50px;
	color: #FFFFFF;
	display: flex;
    justify-content: space-between;
	margin-bottom: 50px;
}
.top-service_list .box .left_box{
	width: 55%;
	padding: 60px 60px 60px 100px;
	position: relative;
}
.top-service_list .box .right_box{
	width: 45%;
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	border-top-right-radius: 50px;
	border-bottom-right-radius: 50px;
}
.products{background-image: url(../../images/top/service_04.jpg);}
.products_02{background-image: url(../../images/top/service_02.jpg);}
.products_03{background-image: url(../../images/top/service_03.jpg);}

.top-service_list .box span{
	background: linear-gradient(#372316, #1c120d);
	border-radius: 50px;
	display: inline-block;
	padding: 5px 20px;
	color: #FFFFFF;
	font-size: 14px;
	margin-bottom: 5px;
}
.top-service_list .box .text_ara{
	margin-top: 20px;
}
.top-service_list .left_box .heading{
	  font-family: "Momo Trust Display", sans-serif;
  font-weight: 400;
  font-style: normal;
	font-size: 18px;
	position: absolute;
	top: 70px;
	left: 35px;
	writing-mode: vertical-rl; 
	letter-spacing: 0.08em;
}
/* 画像ループ */
.wrap {
  overflow: hidden;
	margin: 130px 0 0;
}
.sliding {
	background-repeat: repeat-x;
	background-image: url(../../images/top/slider_img.png);
	height: 170px;
	width: 3384px;
	animation: slide 60s linear infinite;
	background-size: auto 170px;
	 mix-blend-mode: multiply;

}
@keyframes slide{
  0%{
    transform: translate3d(0, 0, 0);
  }
  100%{
    transform: translate3d(-1692px, 0, 0);
  }
}
.top_products{
	margin: 100px 0 0;
	padding: 0 0 200px;
}
.top_products .title_ara {
  margin-bottom: 65px;
  color: #FFFFFF;
}
.top_products .text_ara{color: #FFFFFF;margin-bottom: 50px;}
.top_products .box{
	display: flex;
    align-items: center;
    justify-content: space-between;
}
.top_products .box .left_box{width: 40%;}
.top_products .box .right_box{width: 50%;}

  /*TOP縦のスライダー*/
#top_buy{
	position: relative;
	background-color: #168caf;

}
.top_buy_inner{
	padding: 0 0 500px;
position: relative;
}
#top_buy .box {
  position: absolute;
  right: 3vw;
  top: 120px;
  width: 50%;
  z-index: 5;
}
#top_buy .title_ara{margin-bottom: 50px;}

#top_buy .title_ara .title_h2,#top_buy .title_ara p,#top_buy .box .text_ara p,.top_company p{color: #FFffff;}
#top_buy .box .text_ara p{
	margin-bottom: 80px;
	max-width: 500px;
}
#top_buy .btn_01 a {
  max-width: 350px;
}

#top_buy .btn a{
	max-width: 320px;
	width: 90%;
}
.logo_bk{
	max-width: 483px;
	width: 70%;
  position: absolute;
  left: 50px;
  top: 50px;
  z-index: 0;
  margin: 0;
}
.color_spray_04{
	position: absolute;
	right: 30%;
	bottom: 70px;
	width: 60px;
	z-index: 10;
}


.recruit_area .con_inr {
    position: relative;
    width: 100%;
    margin: 0;

    padding: 25.4rem 6rem 31.6rem 10rem;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    overflow: hidden; }

    .recruit_area .con_inr:after {
      content: "";
      display: block;
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
background: -webkit-gradient(linear, right top, left top, color-stop(8.01%, #168caf), to(rgba(54, 64, 91, 0)));
background: linear-gradient(270deg, #168caf 8.01%, rgba(22, 140, 175, 0.2) 100%);
      z-index: 3; }

.recruit_area .recruit_slide {
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  width: 82%;
  height: 2072px;
  top: -15rem;
  right: 60%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-transform: rotate(30deg);
  transform: rotate(30deg);
  -webkit-transform-origin: left top;
  transform-origin: center center;
  z-index: 2;
}
    
.recruit_area .recruit_slide li {
      width: calc(33.33% - 1.066rem);
      height: 100%; }
.recruit_area .recruit_slide li:nth-child(2) .slide_wrap {
	-webkit-animation: slideShow02 80s infinite linear 1s both;
	animation: slideShow02 80s infinite linear 1s both; }
.recruit_area .recruit_slide .slide_wrap {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      -webkit-animation: slideShow 80s infinite linear 1s both;
              animation: slideShow 80s infinite linear 1s both; }
.recruit_area .recruit_slide .slide_wrap img {
        border-radius: 4px;
        margin-bottom: 1.6rem; }
.recruit_area .recruit_slide .slide {
      width: 100%; }




@media screen and (max-width: 800px) {
/*ここから */
.recruit_area .con_inr {
    width: 100%;
    padding: 20.5rem 6% 24.5rem; }
.recruit_area .con_inr:after {
      background: -webkit-gradient(linear, left top, right top, color-stop(27.6%, #168caf), to(rgba(22, 140, 175, 0.25)));
      background: linear-gradient(90deg, #168caf 27.6%, rgba(22, 140, 175, 0.25) 100%); }
#top_buy .box {
  right: auto;
  top: 100px;
	left: auto;
  width: 80%;
	margin: auto;
}
	
  .recruit_area .recruit_slide {
    left: 11.46%;
    width: 506px;
    height: 1136px;
    top: -91px; } 
}
@media screen and (max-width: 600px) {
  .recruit_slide {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    position: absolute;
    width: 506px;
    height: 818px;
    top: 0rem;
    left: 16%; }
    .recruit_slide li {
      width: calc(33.33% - .8rem); }
      .recruit_slide li:nth-child(2) .slide_wrap {
        -webkit-animation: slideShow02 80s infinite linear 1s both;
                animation: slideShow02 80s infinite linear 1s both; }
    .recruit_slide .slide_wrap {
      -webkit-animation: slideShow 80s infinite linear 1s both;
              animation: slideShow 80s infinite linear 1s both; }
      .recruit_slide .slide_wrap img {
        margin-bottom: .8rem; }
.color_spray_04{
	right: auto;
	bottom: 70px;
	width: 44px;
	left: 0;
}
}



@-webkit-keyframes slide_txt {
  0% {
    background-position: 3527px 0; }
  100% {
    background-position: 0 0; } }
@keyframes slide_txt {
  0% {
    background-position: 3527px 0; }
  100% {
    background-position: 0 0; } }
@-webkit-keyframes slide_img {
  0% {
    background-position: -4302px 0; }
  100% {
    background-position: 0 0; } }
@keyframes slide_img {
  0% {
    background-position: -4302px 0; }
  100% {
    background-position: 0 0; } }
@-webkit-keyframes slideY_img {
  0% {
    background-position: 0 1652px; }
  100% {
    background-position: 0 0; } }
@keyframes slideY_img {
  0% {
    background-position: 0 1652px; }
  100% {
    background-position: 0 0; } }
@-webkit-keyframes slideShow {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0); }
  100% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%); } }
@keyframes slideShow {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0); }
  100% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%); } }
@-webkit-keyframes slideShow02 {
  0% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%); }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0); } }
@keyframes slideShow02 {
  0% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%); }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0); } }
@media screen and (max-width: 800px) {
@-webkit-keyframes slide_txt {
    0% {
      background-position: 2454px 0; }
    100% {
      background-position: 0 0; } }
  @keyframes slide_txt {
    0% {
      background-position: 2454px 0; }
    100% {
      background-position: 0 0; } }
  @-webkit-keyframes slide_img {
    0% {
      background-position: -2151px 0; }
    100% {
      background-position: 0 0; } }
  @keyframes slide_img {
    0% {
      background-position: -2151px 0; }
    100% {
      background-position: 0 0; } } }



.top_company{
	background: linear-gradient(rgba(0,0,0,0.4), rgba(0,0,0,0.4)),
    url(../../images/top/company_bk.jpg);
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
}
.top_company .title_ara {
  margin-bottom: 50px;
}
.top_company .text_ara{
	margin-bottom: 80px;
}
.p-front-news .c-ttl__large{color: #4e2b0e;}


/* TOP_news */
.color_spray_05{
	width: 43px;
	position: absolute;
	top: -60px;
	left: -60px;
}



@media screen and (max-width: 1240px) {
#top_buy .box {
  width: 65%;
}	
}
@media screen and (max-width: 1024px) {
.color_spray {
  right: 0px;
}

}

@media screen and (max-width: 768px) {
.p-front-about {
  padding: 80px 0 85px;
	}
.color_spray {
  right: 30px;
	top: 150px;
	width: 60px;
}
.p-front-about .sec_02 {
  margin: 30px 0;
}
.p-front-about .sec_02 .box_right{
	width: 100%;
}
.p-front-about .sec_03 span {
 font-size: 5.688vw;
}
.p-front-about .sec_03 p{
	margin-top: 50px;
	}
.p-front-about .sec_03 .btn_01 {
  margin-top: 50px;
}
.colorful {
  margin-bottom: 20px;
}
.top_service .title_ara {
  margin-bottom: 35px;
}
.top-service_list .box .left_box{
	width: 100%;
	padding: 40px 25px 40px 55px;
}
.top-service_list .box {
  border-radius: 50px;
  display: block;
}
.top-service_list .box .right_box{
	width: 100%;
	border-top-right-radius: 0px;
	border-bottom-right-radius: 50px;
	border-bottom-left-radius: 50px;
	height: 300px
}
.top-service_list .left_box .heading {
 font-size: 2.688vw;
  top: 50px;
  left: 20px;
}
.top-service_list .box span {
font-size: 2.8vw;
}
.top-service_list .box .text_ara {
  margin-top: 15px;
}
.top_service {
  padding: 100px 0 100px;
}
.color_spray_02 {
  top: -100px;
  right: calc(50% + 100px);
}
.wrap {
  margin: 70px 0 0;
}
.sliding {
  height: 100px;
  background-size: auto 100px;
}
.top_products {
  margin: 80px 0 0;
}
.top_products .box {
  display: block;
}
.top_products .box .left_box {
  width: 100%;
}
.top_products .box .right_box{width: 75%;margin: 0 auto 40px;}
.top_products .title_ara {
 text-align: center;
	margin-bottom: 38px;
}
.top_products .text_ara {
  margin-bottom: 30px;
}
.btn_01 p{text-align: center;}
#top_buy .box {
  width: 85%;
}
	
/* TOP_news */
.color_spray_05{
	width: 30px;
	top: 40px;
	 right: 10%;
	left: auto;
}
.c-articleList .c-articleList__date {
  font-size: 11px;
}
.c-articleList .c-articleList__ttl {
  font-size: 3.2vw;
}
}

@media screen and (max-width: 568px) {
.top_products {
    margin: 60px 0 0px;
	padding: 0 0 100px;
  }
.p-front-news__inner__head{
	margin-bottom: 30px;	
	}	
#top_buy .btn_01 a {
  max-width: 100%;
}
}