@charset "UTF-8";
/* 全体 */
.sdgsAera {
	width: 100%;
	position: relative;
	font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Meiryo", sans-serif;
}

@media (min-width:768px) {
	.sdgsAera .pc{ display:block;}
	.sdgsAera .sp { display:none;}
}
@media (max-width:767px) {
	.sdgsAera .pc { display:none;}
	.sdgsAera .sp { display:block;}
}
.sdgsAera img { vertical-align: bottom; width:100%; max-width:100%; padding:0; margin:0;}

/*ローディング*/
#loadingWrap {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  width: 100%;
  height: 100%;
  background: #f3f3f3;
  display: flex;
	flex-flow: wrap;
  justify-content: center;
  align-items: center;
  transition: opacity 0.2s ease;
}
#loadingWrap.fadeout {
  opacity: 0;
  pointer-events: none;
}
.loadingBox {
	width: 100px;
	margin: 0 auto;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
.loadingBox .loadingText {
	flex: 0 0 100%;
	width: 100%;
	text-align: center;
	font-size: 12px;
	color: #999;
}
.loadingBox .spinner {
  width: 30px;
  height: 30px;
margin: 3% auto;
  border-radius: 50%;
  border: 3px solid #FFF;
  border-left-color: #666; 
  /* アニメーションを1秒かけて実行 */
  animation: spinner-rotation 1s linear infinite;
}

/* アニメーションの設定 */
@keyframes spinner-rotation {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}


/*トップビジュアル*/
.sdgsAera .sdgsKV { position: fixed; top: 90px; left: 50%; transform: translateX(-50%); width: 100%; max-width: 1280px; margin: 0 auto; max-height: 843px; background: url("/sustainability/images/h1_sdgs_visual.png") no-repeat; background-position: center 100px; overflow-y: auto; background-size: auto; z-index: 1;}
.sdgsKV.scrollable { position: absolute!important; top: 0!important;}
.newsArea { position: relative;}
.newsArea .newsBox { position: absolute; bottom: 250px; left: 50%; transform: translate(-50%,10%); width: 60%; height: 150px; padding: 10px 20px; max-width: 800px; background-color: #FFF; z-index: 3;}
.newsArea .newsScroll { overflow-y: scroll;}
.newsArea .newsBox p { width: 100%; border-bottom: 2px solid #666; font-size: 18px; color: #666; margin-bottom: 10px; text-align: center;}
.newsArea .newsBox dl { display: flex; flex-wrap: wrap; align-items: center; font-size: 14px;}
.newsArea .newsBox dl dt { flex: 1 1 100px; padding: 5px 5px; background-color: #ccc; margin-right: 20px; margin-bottom: 5px; text-align: center; line-height: 100%;}
.newsArea .newsBox dl dd { flex: 1 1 calc(100% - 120px); margin-bottom: 5px; line-height: 130%;}
.newsArea .newsBox a { color: #666;}
.newsArea .newsBox a:hover { color: #E11F0F;}

/*wave*/
.sdgsAera .sdgsBox { position: absolute; top: 750px; left: 50%; transform: translateX(-50%); width: 100%; max-width: 1280px; margin: /*75*/0px auto 0; z-index: 2;}
.sdgsAera .sdgsBox .whitespace { background-color: #FFF;}
.sdgsAera .sdgsBox .kvdummy img { opacity: 0;}
.sdgsAera .sdgsBox .wave01 { width: 100%; margin-top: -8%; margin-bottom: 0; padding-bottom: 0;}
.sdgsAera .sdgsBox .wave02 { width: 100%; height: 200px; margin-top: 0%; background: url("/sustainability/images/wave02.png") bottom center no-repeat; background-size: contain;}

@media (max-width:1280px) {
	.sdgsAera .sdgsKV { background-size: contain;}
	.newsArea .newsBox { transform: translate(-50%,40%);}
}
@media (max-width:1150px) {
	.newsArea .newsBox { bottom: 210px;}
	.sdgsAera .sdgsBox { top: 700px;}
}
@media (max-width:1085px) {
	.newsArea .newsBox { bottom: 180px;}
	.sdgsAera .sdgsBox { top: 670px;}
}
@media (max-width:1030px) {
	.sdgsAera .sdgsBox { top: 650px;}
}
@media (max-width:990px) {
	.sdgsAera .sdgsBox.scrollable { top: 650px;}
}
@media (max-width:955px) {
	.newsArea .newsBox { bottom: 170px;}
	.newsArea .newsBox p { font-size: 14px;}
	.newsArea .newsBox dl { font-size: 12px;}
	.sdgsAera .sdgsBox { top: 650px;}
	.sdgsAera .sdgsBox.scrollable { top: 600px;}
}
@media (max-width:915px) {
	.newsArea .newsBox { bottom: 160px;}
	.sdgsAera .sdgsBox { top: 600px;}
}
@media (max-width:880px) {
	.sdgsAera .sdgsBox.scrollable { top: 550px;}
}
@media (max-width:845px) {
	.sdgsAera .sdgsBox,
	.sdgsAera .sdgsBox.scrollable { top: 550px;}
}
@media (max-width:800px) {
	.newsArea .newsBox { bottom: 150px;}
	.sdgsAera .sdgsBox.scrollable { top: 530px;}
}
@media (max-width:770px) {
	.newsArea .newsBox { bottom: 150px;}
	.sdgsAera .sdgsBox { top: 530px;}
}
@media (max-width:767px) {
	.sdgsAera .sdgsKV { background: url("/sustainability/images/h1_sdgs_visual_sp.png") no-repeat; background-size: contain; background-attachment: fixed; background-position: center 60px;}
	.newsArea .newsBox { width: 50%; bottom: 230px; max-height: 150px;}
	.newsArea .newsBox p { font-size: 10px;}
	.newsArea .newsBox dl { display: block; font-size: 10px;}
	.newsArea .newsBox dl dt { padding: 0; background-color: #FFF; margin-right: 0; margin-bottom: 5px; text-align: left;}
	.newsArea .newsBox dl dd { padding: 0 0 5px; margin-bottom: 15px; line-height: 130%; border-bottom: 1px solid #666;}
	.sdgsAera .sdgsBox,
	.sdgsAera .sdgsBox.scrollable { top: 700px;}
	.sdgsAera .sdgsBox .wave01 { margin-top: -15%;}
	.sdgsAera .sdgsBox .wave02 { height: 100px;}
}
@media (max-width:700px) {
	.sdgsAera .sdgsBox.scrollable { top: 650px;}
}
@media (max-width:676px) {
	.newsArea .newsBox { bottom: 230px;}
	.sdgsAera .sdgsBox,
	.sdgsAera .sdgsBox.scrollable { top: 600px;}
}
@media (max-width:645px) {
	.newsArea .newsBox { bottom: 190px;}
}
@media (max-width:600px) {
	.sdgsAera .sdgsBox.scrollable { top: 530px;}
}
@media (max-width:580px) {
	.newsArea .newsBox { bottom: 170px;}
	.sdgsAera .sdgsBox { top: 550px;}
}
@media (max-width:530px) {
	.newsArea .newsBox { bottom: 160px; max-height: 100px;}
	.newsArea .newsBox dl { font-size: 10px;}
	.sdgsAera .sdgsBox,
	.sdgsAera .sdgsBox.scrollable { top: 500px;}
}
@media (max-width:500px) {
	.newsArea .newsBox { bottom: 150px;}
	.sdgsAera .sdgsBox { top: 450px;}
	.sdgsAera .sdgsBox.scrollable { top: 420px;}
}
@media (max-width:445px) {
	.newsArea .newsBox { bottom: 140px;}
	.sdgsAera .sdgsBox { top: 400px;}
}
@media (max-width:406px) {
	.newsArea .newsBox { bottom: 130px; max-height: 80px;}
	.sdgsAera .sdgsBox { top: 380px;}
}
@media (max-width:370px) {
	.newsArea .newsBox { bottom: 100px;}
	.sdgsAera .sdgsBox { top: 370px;}
}
@media (max-width:350px) {
	.newsArea .newsBox { bottom: 80px;}
	.sdgsAera .sdgsBox { top: 350px;}
}
@media (max-width:340px) {
	.newsArea .newsBox { bottom: 80px;}
	.sdgsAera .sdgsBox { top: 330px;}
}

/*フォント*/
.sdgsAera h2 { font-size: 42px; font-weight: 700; line-height: 200%; letter-spacing: 0em;}
.sdgsAera h3 { font-size: 14px; font-weight: 700; line-height: 200%; letter-spacing: 0em;}
.sdgsAera .sdgsFNormalGo { font-size: 16px; font-weight: 400; line-height: 180%; letter-spacing: 0em;}
.sdgsAera .sdgsFNormal,.sdgsFNormal { font-size: 16px; font-weight: 400; line-height: 180%; letter-spacing: 0em;}
.sdgsTextBold { font-weight: 700;}

@media (max-width:767px) {
	.sdgsAera h2 { font-size: 28px; line-height: 150%;}
	.sdgsAera h3 { font-size: 14px; line-height: 200%;}
	.sdgsAera .sdgsFNormalGo { font-weight: 600; line-height: 200%;}
	.sdgsAera .sdgsFNormal { font-size: 12px;}
}


/*sec01 Top Message*/
.sdgsAera .topMessage { width: 100%; background-color: #F6F6F8; padding: 3% 0 0%; margin-top: -1px;}
.sdgsAera .topMessage .topMessageBox { width: 80%; max-width: 1080px; margin: 0 auto; padding-bottom: 10%; display: flex; flex-direction: row-reverse; justify-content: space-between;}
.sdgsAera .topMessage .sec01Img { flex: 43% 0 0; max-width: 420px;}
.sdgsAera .topMessage .sec01Text { flex: 50% 0 0; text-align: left;}
.sdgsAera .topMessage .sec01Text h2 { padding: 0; margin: 0;}
.sdgsAera .topMessage .sec01Text h3 { padding-bottom: 30px; margin-top: -6px;}
.sdgsAera .topMessage .sec01Text .presidentBox { text-align: right; margin-top: 30px; line-height: 150%;}
.sdgsAera .topMessage .sec01Text .presidentBox .presidentName { font-size: 22px; font-weight: 600; line-height: 200%;}

@media (max-width:767px) {
	.sdgsAera .topMessage .topMessageBox { width: 80%; display: block;}
	.sdgsAera .topMessage .sec01Img { flex: none; width: 100%; max-width: 420px;}
	.sdgsAera .topMessage .sec01Text { flex: none; width: 100%;}
	.sdgsAera .topMessage .sec01Text h2,
	.sdgsAera .topMessage .sec01Text h3 { text-align: center;}
}
	

/*sec02 Our Goal*/
.sdgsAera .ourGoal { width: 100%; background-color: #FFF; padding: 0 0 10%;}
.sdgsAera .ourGoal .ourGoalBox { width: 80%; max-width: 1080px; margin: 0 auto; display: flex; justify-content: space-between;}
.sdgsAera .ourGoal .sec02Img { flex: 55% 0 0; max-width: 620px; margin-top: -120px;}
.sdgsAera .ourGoal .sec02Text { flex: 40% 0 0; text-align: left; margin-top: -100px;}
.sdgsAera .ourGoal .sec02Text h2 { padding: 0; margin: 0;}
.sdgsAera .ourGoal .sec02Text h3 { padding-bottom: 30px; margin-top: -6px;}

@media (max-width:990px) {
	.sdgsAera .ourGoal .sec02Img { margin-top: -90px;}
	.sdgsAera .ourGoal .sec02Text { margin-top: -70px;}
}

@media (max-width:767px) {
	.sdgsAera .ourGoal .ourGoalBox { width: 80%; display: block;}
	.sdgsAera .ourGoal .sec02Img { flex: none; margin: 10px auto 0;}
	.sdgsAera .ourGoal .sec02Text { flex: none; margin-top: 0px;}
	.sdgsAera .ourGoal .sec02Text h2,
	.sdgsAera .ourGoal .sec02Text h3 { text-align: center;}
}


/*sec03 About Our Action*/
.sdgsAera .aboutOurAction { width: 100%; background-color: #F6F6F8;}
.sdgsAera .aboutOurAction .aboutOurActionBox { width: 100%; background: url("/sustainability/images/wave02.png") bottom center no-repeat; background-size: contain; padding: 7% 0 0;}
.sdgsAera .aboutOurAction .aboutOurActionBox h2 { text-align: center; padding: 0; margin: 0;}
.sdgsAera .aboutOurAction .aboutOurActionBox h3 { text-align: center; padding-bottom: 10px; margin-top: -6px;}
.sdgsAera .aboutOurAction .aboutOurActionBox p { text-align: center; padding-bottom: 4%;}
.sdgsAera .aboutOurAction .aboutOurActionBox ul { width: 70%; max-width: 828px; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: space-between;}
.sdgsAera .aboutOurAction .aboutOurActionBox ul li { flex: 320px 0 0; margin-right: 50px; margin-bottom: 60px;}
.sdgsAera .aboutOurAction .aboutOurActionBox ul li:nth-of-type(2),
.sdgsAera .aboutOurAction .aboutOurActionBox ul li:nth-of-type(4) { margin-right: 0px;}
.sdgsAera .aboutOurAction .aboutOurActionBox ul li:nth-of-type(3),
.sdgsAera .aboutOurAction .aboutOurActionBox ul li:nth-of-type(4) { margin-bottom: 0px;}
.sdgsAera .aboutOurAction .aboutOurActionBox ul li .sec03Img { width: 100%; padding-bottom: 20px;}
.sdgsAera .aboutOurAction .aboutOurActionBox ul li h4 { font-size: 24px; font-weight: 600; line-height: 180%; letter-spacing: 0em; text-align: center;}
.sdgsAera .aboutOurAction .aboutOurActionBox ul li:nth-of-type(1) h4{ color: #3A9927;}
.sdgsAera .aboutOurAction .aboutOurActionBox ul li:nth-of-type(2) h4 { color: #0163AD;}
.sdgsAera .aboutOurAction .aboutOurActionBox ul li:nth-of-type(3) h4 { color: #E11F0F;}
.sdgsAera .aboutOurAction .aboutOurActionBox ul li:nth-of-type(4) h4 { color: #CD7D01;}
.sdgsAera .aboutOurAction .aboutOurActionBox ul li .sec03Text { text-align: left; padding-bottom: 30px; height: 120px;}
.sdgsAera .aboutOurAction .aboutOurActionBox ul li .sec03IconBox { width: 100%; display: flex; flex-wrap: wrap;}
.sdgsAera .aboutOurAction .aboutOurActionBox ul li .sec03IconBox .sec03IconItem { width: 100px; flex: 100px 0 0; padding-bottom: 10px; margin-right: 10px; box-sizing: border-box;}
.sdgsAera .aboutOurAction .aboutOurActionBox ul li .sec03IconBox .sec03IconItem:nth-of-type(3) { margin-right: 0px;}

.sdgsAera .aboutOurAction .aboutOurActionBox ul li .kanrenLine { width: 100%; margin: 3% auto; display: flex; align-items: center; line-height: 0%; font-weight: 600;}
.sdgsAera .aboutOurAction .aboutOurActionBox ul li .kanrenLine:after { content: ""; flex-grow: 1; height: 1px; display: block;}
.sdgsAera .aboutOurAction .aboutOurActionBox ul li .kanrenLine:after { margin-left: .4em; background: #000;}

@media (max-width:990px) {
	.sdgsAera .aboutOurAction .aboutOurActionBox p { width: 95%; margin: 0 auto;}
	.sdgsAera .aboutOurAction .aboutOurActionBox ul { width: 100%; max-width: 828px; margin: 0 auto; display: block;}
	.sdgsAera .aboutOurAction .aboutOurActionBox ul li { flex: none; width: 320px; margin: 0 auto 60px;}
	.sdgsAera .aboutOurAction .aboutOurActionBox ul li:nth-of-type(2),
	.sdgsAera .aboutOurAction .aboutOurActionBox ul li:nth-of-type(4) { margin-right: auto;}
	.sdgsAera .aboutOurAction .aboutOurActionBox ul li:nth-of-type(3),
	.sdgsAera .aboutOurAction .aboutOurActionBox ul li:nth-of-type(4) { margin-bottom: 60px;}
	.sdgsAera .aboutOurAction .aboutOurActionBox ul li .sec03Text { padding-bottom: 20px; height: auto;}
}



/*sec04 Ongoing Action*/
.sdgsAera .ongoingAction { width: 100%; margin-top: 10%; background: url("/sustainability/images/wave03.png") bottom center no-repeat; background-size: contain;}
.sdgsAera .ongoingAction .ongoingActionBox { width: 100%;}
.sdgsAera .ongoingAction .ongoingActionBox h2 { text-align: center; padding: 0; margin: 0;}
.sdgsAera .ongoingAction .ongoingActionBox h3 { text-align: center; padding-bottom: 10px; margin-top: -6px;}
.sdgsAera .ongoingAction .ongoingActionBox ul { width: 95%; max-width: 1180px; margin: 20px auto 0; display: flex; flex-wrap: wrap; justify-content: center;}
.sdgsAera .ongoingAction .ongoingActionBox ul li { width: 272px; height: 240px; flex: 272px 0 0; text-align: center; background-size: contain; background-position: center center; margin: 0 10px 20px; background-color: #FFF;}
.sdgsAera .ongoingAction .ongoingActionBox ul li.special_bg_01 { background: url("/sustainability/images/img_special_bg_01.png") no-repeat;}
.sdgsAera .ongoingAction .ongoingActionBox ul li.special_bg_02 { background: url("/sustainability/images/img_special_bg_02.png") no-repeat;}
.sdgsAera .ongoingAction .ongoingActionBox ul li.special_bg_03 { background: url("/sustainability/images/img_special_bg_03.png") no-repeat;}
.sdgsAera .ongoingAction .ongoingActionBox ul li.special_bg_04 { background: url("/sustainability/images/img_special_bg_04.png") no-repeat;}
.sdgsAera .ongoingAction .ongoingActionBox ul li.special_bg_05 { background: url("/sustainability/images/img_special_bg_05.png") no-repeat;}
.sdgsAera .ongoingAction .ongoingActionBox ul li .torikumiBox { width: 272px; height: 240px; background-color: rgba(255, 255, 255, 0.4);}

.sdgsAera .ongoingAction .ongoingActionBox ul li .torikumiBox .torikumiR { width: 272px; height: 240px; background-color: rgba(223,29,17,0.6); padding: 20px 15px 15px; box-sizing: border-box;}
.sdgsAera .ongoingAction .ongoingActionBox ul li .torikumiBox .torikumiG { width: 272px; height: 240px; background-color: rgba(59,153,38,0.6); padding: 20px 15px 15px; box-sizing: border-box;}
.sdgsAera .ongoingAction .ongoingActionBox ul li .torikumiBox .torikumiB { width: 272px; height: 240px; background-color: rgba(1,100,174,0.6); padding: 20px 15px 15px; box-sizing: border-box;}
.sdgsAera .ongoingAction .ongoingActionBox ul li .torikumiBox .torikumiY { width: 272px; height: 240px; background-color: rgba(199,122,3,0.6); padding: 20px 15px 15px; box-sizing: border-box;}

.sdgsAera .ongoingAction .ongoingActionBox ul li .torikumiBG .torikumiR { background-color: rgba(237,120,111,0.6);}
.sdgsAera .ongoingAction .ongoingActionBox ul li .torikumiBG .torikumiG { background-color: rgba(59,153,38,0.6);}
.sdgsAera .ongoingAction .ongoingActionBox ul li .torikumiBG .torikumiB { background-color: rgba(0,101,174,0.6);}

.sdgsAera .ongoingAction .ongoingActionBox ul li .torikumiBox .torikumiR:hover { background-color: rgba(223,29,17,0.9);}
.sdgsAera .ongoingAction .ongoingActionBox ul li .torikumiBox .torikumiG:hover { background-color: rgba(59,153,38,0.9);}
.sdgsAera .ongoingAction .ongoingActionBox ul li .torikumiBox .torikumiB:hover { background-color: rgba(1,100,174,0.9);}
.sdgsAera .ongoingAction .ongoingActionBox ul li .torikumiBox .torikumiY:hover { background-color: rgba(199,122,3,0.9);}

.sdgsAera .ongoingAction .ongoingActionBox ul li .torikumiBox .sec04Img { width: 46px; margin: 0 auto 20px;}
.sdgsAera .ongoingAction .ongoingActionBox ul li .torikumiBox .sec04Text { color: #FFF;}

@media (max-width:767px) {
	.sdgsAera .ongoingAction .ongoingActionBox ul { width: 90%;}
	.sdgsAera .ongoingAction .ongoingActionBox ul li { width: 48%; height: 220px; flex: 48% 0 0; margin: 0 1% 2%; background-size: 100%!important; background-position: center center!important;}
	.sdgsAera .ongoingAction .ongoingActionBox ul li .torikumiBox { width: 100%; height: 220px;}
	.sdgsAera .ongoingAction .ongoingActionBox ul li .torikumiBox .torikumiR, 
	.sdgsAera .ongoingAction .ongoingActionBox ul li .torikumiBox .torikumiG,
	.sdgsAera .ongoingAction .ongoingActionBox ul li .torikumiBox .torikumiB,
	.sdgsAera .ongoingAction .ongoingActionBox ul li .torikumiBox .torikumiY { width: 100%; height: 220px; padding: 20px 15px 15px;}
	.sdgsAera .ongoingAction .ongoingActionBox ul li .torikumiBox .sec04Text { font-size: 14px; line-height: 150%;}
}


	

/*sec06 Organization*/
.sdgsAera .organization { width: 100%; padding: 5% 0; background-color: #E6EAF4;}
.sdgsAera .organization .organizationBox { width: 95%; max-width: 1160px; margin: 0 auto; background-color: #FFF;}
.sdgsAera .organization .organizationBox h2 { text-align: center; padding: 0; margin: 0;}
.sdgsAera .organization .organizationBox h3 { text-align: center; padding-bottom: 10px; margin-top: -6px;}
.sdgsAera .organization .organizationBox p { text-align: center; padding-bottom: 2%;}
.sdgsAera .organization .organizationBox .sec06Img { width: 100%; max-width: 1160px;}

@media (max-width:767px) {
	.sdgsAera .organization .organizationBox h2 { padding: 20px 0 0;}
	.sdgsAera .organization .organizationBox p { width: 90%; margin: 0 auto;}
}


/*sec07 Plus Thermos*/
.sdgsAera .plusThermos { width: 100%; padding: 7% 0;}
.sdgsAera .plusThermos .plusThermosBox { width: 100%;}
.sdgsAera .plusThermos .plusThermosBox h2 { width: 50%; max-width: 450px; margin: 0 auto;}
.sdgsAera .plusThermos .plusThermosBox p { text-align: center; padding: 30px 0;}
.sdgsAera .plusThermos .plusThermosBox ul { width: 95%; max-width: 1180px; margin: 20px auto 0; display: flex; flex-wrap: wrap; justify-content: center;}
.sdgsAera .plusThermos .plusThermosBox ul li { width: 30%; flex: 30% 0 0; max-width: 400px; margin: 0 10px 20px; border-radius: 10px; box-shadow: 2px 2px 10px rgba(0,0,0,0.2); padding-bottom: 10px;}
.sdgsAera .plusThermos .plusThermosBox ul li img { border-radius: 10px;}
.sdgsAera .plusThermos .plusThermosBox .sec07Arrow { width: 100%; position: relative; text-align: right; padding: 0 2.5em 0 0; box-sizing: border-box;}
.sdgsAera .plusThermos .plusThermosBox .sec07Arrow a:hover { color: #E60112;}
/*.mod-iconArrowRight*/
.sdgsAera .sdgsArrow {
	color: #000;
    position: absolute;
    right: 1.5em!important;
    top: 0em;
    -ms-transform: translateX(50%);
    transform: translateX(50%);
    font-size: 16px;
	-webkit-transition:	all 0.2s ease;
	transition:	all 0.2s ease;
}
.sdgsAera .plusThermos .plusThermosBox .sec07Arrow a:hover .sdgsArrow { color: #E60112; right: 1em!important;}

@media (max-width:767px) {
	.sdgsAera .plusThermos { padding: 7% 0 100px;}
	.sdgsAera .plusThermos .plusThermosBox h2 { width: 80%; max-width: 450px;}
	.sdgsAera .plusThermos .plusThermosBox p { width: 95%; margin: 0 auto;}
	.sdgsAera .plusThermos .plusThermosBox ul { width: 80%; max-width: 1180px; margin: 20px auto 0; display: block;}
	.sdgsAera .plusThermos .plusThermosBox ul li { width: 100%; flex: none; max-width: 400px; margin: 0 auto 20px;}
	.sdgsAera .plusThermos .plusThermosBox .sec07Arrow { width: 90%; margin: 0 auto;}
}


/*モーダル*/
.sdgsModalBox { width: 90%; max-width: 700px; background-color: #FFF; margin: 20px auto 0; border-radius: 10px; position: relative; box-shadow: 2px 2px 10px rgba(0,0,0,0.2); /*padding-bottom: 30px; */padding: 60px 1% 30px;}
.sdgsModalBox h2 { width: 90%; margin: 0 auto; font-size: 30px; text-align: center; padding: 50px 0 20px; line-height: 150%;}
.sdgsModalBox .sdgsModalLine { width: 90%; margin: 0 auto; border-top: 2px solid #DDD; padding-bottom: 20px;}
.sdgsModalBox p { width: 90%; margin: 0 auto 20px; font-size: 18px;}
.sdgsModalBox .sdgsModalImg,
.sdgsModalBox .sdgsModalImg2,
.sdgsModalBox .sdgsModalImg3 { width: 70%; margin: 10px auto; text-align: center; font-size: 16px;}
.sdgsModalBox .sdgsModalImg2 { width: 45%;}
.sdgsModalBox .sdgsModalImg3 { width: 80%;}
.sdgsModalBox .sdgsModalImg img { max-height: 300px;}
.sdgsModalBox .sdgsModalImgBox,
.sdgsModalBox .sdgsModalImgBox2,
.sdgsModalBox .sdgsModalImgBox3 { width: 90%; margin: 10px auto; text-align: center; display: flex; align-items: center; justify-content: space-between;}
.sdgsModalBox .sdgsModalImgBox2,
.sdgsModalBox .sdgsModalImgBox3 { width: 80%;}
.sdgsModalBox .sdgsModalImgBox img,
.sdgsModalBox .sdgsModalImgBox2 img { width: 48%!important;}
.sdgsModalBox .sdgsModalImgBox3 img { width: 30%!important;}
.sdgsModalBox .sdgsModalClose { width: 40px; height: 40px; position: absolute; top: 10px; right: 10px; z-index: 999;}
.sdgsModalBox a { color: #999; text-decoration: underline; transition: all 0.2s ease;}
.sdgsModalBox a:hover { color: #E60112;}
.mfp-close { display: none!important;}
.mfp-bg { opacity: 0.6;}
.mfp-container { padding-right: 22px;}
.sdgsModalBox .sdgsTextCenter { text-align: center;}
.sdgsTextBold { font-weight: bold!important;}
.sdgsModalBox .sdgsBlueBox { width: 90%; max-width: 400px; margin-left: 5%; margin-bottom: 20px; padding: 10px; border: solid 1px #1786FF; font-size: 18px;} 

/*スライド*/
.sdgsSlider {
	/*width: 700px;*/
	/*padding: 60px 10px 0;*/
	/*padding: 40px;*/
}
.sdgsSlider .slick-slide {
  width: 680px;
  margin: 0px auto;
  position: relative;
  overflow: hidden;
}

.sdgsSlider .slick-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.slick-dots {
	max-width: 670px;
	margin: 0 auto;
  text-align: center;
	display: flex;
}
.slick-dots li {
	width: 15px;
  height: 15px;
	margin: 6px;
}
.sdgsDots01 .slick-dots button,
.sdgsDots02 .slick-dots button,
.sdgsDots03 .slick-dots button,
.sdgsDots04 .slick-dots button,
.sdgsDots05 .slick-dots button,
.sdgsDots06 .slick-dots button,
.sdgsDots07 .slick-dots button,
.sdgsDots08 .slick-dots button,
.sdgsDots09 .slick-dots button,
.sdgsDots10 .slick-dots button,
.sdgsDots11 .slick-dots button,
.sdgsDots12 .slick-dots button,
.sdgsDots13 .slick-dots button,
.sdgsDots14 .slick-dots button,
.sdgsDots15 .slick-dots button,
.sdgsDots16 .slick-dots button,
.sdgsDots17 .slick-dots button,
.sdgsDots18 .slick-dots button,
.sdgsDots19 .slick-dots button{
  display: block;
  width: 15px;
  height: 15px;
  font-size: 0;
  padding: 0;
  border: 0;
  outline: none;
  cursor: pointer;
  background: #DDD;
  border-radius: 50%;
	list-style: none;
}
.slick-dots .slick-active button{
  background: #E60112;
}
/*スライド*/



@media (max-width:767px) {
	.sdgsModalBox { width: 640px; margin: 20px auto 0; box-sizing: border-box;}
	.sdgsModalBox h2 { width: 90%; font-size: 20px;}
	.sdgsModalBox .sdgsModalLine { width: 90%;}
	.sdgsModalBox p { width: 90%; margin: 0 auto 20px; font-size: 12px;}
	.sdgsModalBox .sdgsModalImg { width: 70%; font-size: 12px;}
	.sdgsModalBox .sdgsModalImg img { max-height: 200px;}
	.sdgsModalBox .sdgsModalClose { width: 30px; height: 30px;}
	.mfp-container { padding-right: 0px!important;}
	.sdgsModalBox .sdgsBlueBox { width: 90%; font-size: 12px; margin: 0 auto;}
	.sdgsSlider .slick-slide { width: 620px!important;}
}
@media (max-width:700px) {
	.sdgsModalBox { width: 600px!important;}
	.sdgsSlider .slick-slide { width: 580px!important;}
}
@media (max-width:600px) {
	.sdgsModalBox { width: 500px!important;}
	.sdgsSlider .slick-slide { width: 480px!important;}
}
@media (max-width:500px) {
	.sdgsModalBox { width: 400px!important;}
	.sdgsSlider .slick-slide { width: 380px!important;}
}
@media (max-width:400px) {
	.sdgsModalBox { width: 300px!important;}
	.sdgsSlider .slick-slide { width: 280px!important;}
}
@media (max-width:330px) {
	.sdgsModalBox { width: 230px!important;}
	.sdgsSlider .slick-slide { width: 210px!important;}
}



.oa03_indent {
	letter-spacing: 0.2em;
}
@media (max-width:767px) {
	.oa03_indent {
		letter-spacing: 0;
	}
}