@charset "utf-8";
/*.design-bg{ width: 1400px; height: 8957px; background: url('../design_img/achievement.jpg') 0 0 no-repeat; position: absolute; top: 0; left: 50%; -webkit-transform: translate(-50%,0); transform: translate(-50%,0); z-index: -1; opacity: .5; background-size: 1400px; }*/


@-webkit-keyframes arrow {
	50% {
		bottom: -26px;
	}
	100% {
		bottom: -23px;
	}
}


@keyframes arrow {
	50% {
		bottom: -26px;
	}
	100% {
		bottom: -23px;
	}
}

@media print, screen and (min-width: 751px) {
#main 					{ margin-top: 60px; }
.mainImage 				{ height: 280px; background: url('../img/achievement/main-image.jpg') 50% 50% no-repeat; background-size: cover;  }

#care .linkNav 			{ width: 100%; max-width: 996px; margin: -75px auto 0; display: -webkit-box; display: -ms-flexbox; display: flex; z-index: 2; position: relative; }
#care .linkNav li 		{ margin-right: 3px; }
#care .linkNav li a 	{ display: block; }
#care .linkNav li a:hover{  }
#care .linkNav li:last-of-type{ margin-right: 0; }
#care .linkNav li p 	{ margin-top: 33px; font-size: 1.15rem; font-weight: 700; text-align: center; position: relative; }
#care .linkNav li p span:nth-of-type(1){ margin-bottom: 14px; display: block; }
#care .linkNav li p span:nth-of-type(2){ display: block; }
#care .linkNav li p:before{ content: ''; width: 4px; height: 50px; background-color: #7cc156; position: absolute; top: -58px; left: 50%; -webkit-transform: translate(-50%,0); transform: translate(-50%,0); }
#care .linkNav li p:after{ content: ''; width: 23px; height: 13px; background: url('../img/common/arrow-b.svg') 0 0 no-repeat; position: absolute; bottom: -23px; left: 50%; -webkit-transform: translate(-50%,0); transform: translate(-50%,0); }
#care .linkNav li a:hover p:after{ -webkit-animation: arrow .5s; animation: arrow .5s; }

.case 				{ margin-top: 180px; padding-bottom: 140px; position: relative; }
.case:before 		{ content: ''; width: 100%; height: 400px; background-color: #fff; position: absolute; top: 0; left: 0; z-index: -1; }
.case:after 		{ content: ''; width: 100%; height: 100%; background-color: #f9f7f3; position: absolute; top: 0; left: 0; z-index: -2; }

.imgTitle 				{ font-size: 1.7rem; text-align: center; }
.imgTitle span 			{ margin-top: 17px; display: block; }

.top.master 			{ max-width: 1400px; margin-top: 68px; display: -webkit-box; display: -ms-flexbox; display: flex; }
.top.master>figure 		{ width: 47.858%; margin-top: 8px; }
.top.master>div 		{ width: 40%; max-width: 470px; margin-left: 4.5%; text-align: justify; }
.top.master>div h3 		{ margin-bottom: 20px; font-size: 1.45rem; line-height: 1.7; }
.top.master>div p 		{ line-height: 2.05; font-size: .92rem; }
.top.master>div>div 	{ margin-top: 69px; padding: 30px 30px 20px; border: 2px solid #8cd059; border-radius: 10px; background-color: #fff; font-size: .98rem; }
.top.master>div>div dl 	{ display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.top.master>div>div dl>div{ width: 50%; display: -webkit-box; display: -ms-flexbox; display: flex; line-height: 1.5; }
.top.master>div>div dl>div:nth-of-type(2n){ margin-top: 5px; }
.top.master>div>div dl>div:nth-of-type(1){ -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; }
.top.master>div>div dl>div:nth-of-type(2){ -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; }
.top.master>div>div dl>div:nth-of-type(3){ -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; }
.top.master>div>div dl>div:nth-of-type(4){ -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; }
.top.master>div>div dl>div dt{ width: 4em; font-weight: 700; color: #7cc156; }
.top.master>div>div dl>div dd{ width: calc(100% - 5.2em); margin-left: auto; }

.top.reverse 			{  }
.top.reverse>figure 	{ margin-left: 4.5%; -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; }
.top.reverse>div 		{ margin-left: auto; -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; }

.list 					{ max-width: 1000px; margin-top: 148px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.list li 				{ width: 48%; }
.list li:nth-of-type(2n){ margin-left: auto; }
.list li:nth-of-type(n+3){ margin-top: 55px; }
.list li p 				{ margin-top: 23px; font-size: 1.05rem; text-align: center; }
}

.lineTitle 				{ font-size: 1.6rem; text-align: center }
.lineTitle span 		{ position: relative; display: inline-block; }
.lineTitle span:after 	{ content: ''; width: 100%; height: 4px; background-color: #cb8e71; position: absolute; bottom: -15px; left: 0; }

#case2 .movie 	{ max-width: 998px; margin-top: 120px; padding: 56px 55px; background-color: #fff; }
/*#case2 .movie>div 		{ margin-top: 60px; position: relative; width: 100%; padding-top: 51%; }
#case2 .movie>div iframe 	{ position: absolute; top: 0; right: 0; width: 100% !important; height: 100% !important; }*/
#case2 .movie>div 		{ margin-top: 30px; /*position: relative; width: 100%; padding-top: 51%;*/ }
#case2 .movie>div video 	{ top:0; width: 100%; height: 100%; background: #000; }

#case3 .movie 	{ max-width: 998px; margin-top: 120px; padding: 56px 55px; background-color: #fff; }
/*#case3 .movie>div 		{ margin-top: 60px; position: relative; width: 100%; padding-top: 51%; }
#case3 .movie>div iframe 	{ position: absolute; top: 0; right: 0; width: 100% !important; height: 100% !important; }*/
#case3 .movie>div 		{ margin-top: 30px; /*position: relative; width: 100%; padding-top: 51%;*/ }
#case3 .movie>div video 	{ top:0; width: 100%; height: 100%; background: #000; }


@media screen and (max-width: 1400px) and (min-width: 750px) {
}


@media screen and (max-width: 750px) {
#main 					{ margin-top: 30px; }
.mainImage 				{ height: auto; padding: 50px 2% 90px; background: url('../img/achievement/main-image.jpg') 50% 50% no-repeat; background-size: cover; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }

#care .linkNav 			{ width: 90%; max-width: 996px; margin: -55px auto 0; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; z-index: 2; position: relative; }
#care .linkNav li 		{ width: 49%; }
#care .linkNav li:nth-of-type(2n){ margin-left: auto; }
#care .linkNav li:nth-of-type(n+3){ margin-top: 40px; }
#care .linkNav li a 	{ display: block; }
#care .linkNav li a:hover{  }
#care .linkNav li:last-of-type{ margin-right: 0; }
#care .linkNav li p 	{ margin-top: 33px; font-size: .95rem; font-weight: 700; text-align: center; position: relative; }
#care .linkNav li p span:nth-of-type(1){ display: block; }
#care .linkNav li:nth-of-type(1) p span:nth-of-type(1){ width: 43px; margin: 0 auto 12px; }
#care .linkNav li:nth-of-type(2) p span:nth-of-type(1){ width: 47px; margin: 0 auto 12px; }
#care .linkNav li:nth-of-type(3) p span:nth-of-type(1){ width: 48px; margin: 0 auto 12px; }
#care .linkNav li p span:nth-of-type(2){ font-size: .85rem; display: block; }
#care .linkNav li p:before{ content: ''; width: 2px; height: 34px; background-color: #7cc156; position: absolute; top: -50px; left: 50%; -webkit-transform: translate(-50%,0); transform: translate(-50%,0); }
#care .linkNav li p:after{ content: ''; width: 23px; height: 13px; background: url('../img/common/arrow-b.svg') 0 0 no-repeat; position: absolute; bottom: -23px; left: 50%; -webkit-transform: translate(-50%,0); transform: translate(-50%,0); }
#care .linkNav li a:hover p:after{ -webkit-animation: arrow .5s; animation: arrow .5s; }

.case 				{ margin-top: 80px; position: relative; }
/*.case:before 		{ content: ''; width: 100%; height: 400px; background-color: #fff; position: absolute; top: 0; left: 0; z-index: -1; }
.case:after 		{ content: ''; width: 100%; height: 100%; background-color: #f9f7f3; position: absolute; top: 0; left: 0; z-index: -2; }*/
	
#case2 .movie 			{ max-width: 998px; margin-top: 30px; padding: 25px 20px; background-color: #fff; }
#case2 .movie>div 		{ margin-top: 30px; /*position: relative; width: 100%; padding-top: 51%;*/ }
#case2 .movie>div video 	{ top:0; width: 100%; height: 100%; background: #000; }
#case2 			{ margin-top: 90px; padding-bottom: 60px; position: relative; background-color: #f9f7f3;}
/*#case2:before 	{ content: ''; width: 100%; height: 312px; background-color: #fff; position: absolute; top: 0; left: 0; z-index: -1; }
#case2:after 	{ content: ''; width: 100%; height: 100%; background-color: #f9f7f3; position: absolute; top: 0; left: 0; z-index: -2; }*/
	
#case3 .movie 			{ max-width: 998px; margin-top: 30px; padding: 25px 20px; background-color: #fff; }
#case3 .movie>div 		{ margin-top: 30px; /*position: relative; width: 100%; padding-top: 51%;*/ }
#case3 .movie>div video 	{ top:0; width: 100%; height: 100%; background: #000; }
#case3 			{ margin-top: 90px; padding-bottom: 60px; position: relative; background-color: #f9f7f3; }
/*#case3:before 	{ content: ''; width: 100%; height: 312px; background-color: #fff; position: absolute; top: 0; left: 0; z-index: -1; }
#case3:after 	{ content: ''; width: 100%; height: 100%; background-color: #f9f7f3; position: absolute; top: 0; left: 0; z-index: -2; }*/

.imgTitle 				{ font-size: 1.1rem; text-align: center; line-height: 1.5; background-color: #fff; }
.imgTitle img 			{ width: 32px; }
.imgTitle span 			{ margin-top: 10px; display: block; }

.lineTitle 				{ font-size: 1.2rem; text-align: center }
.lineTitle span 		{ position: relative; display: inline-block; }
.lineTitle span:after 	{ content: ''; width: 100%; height: 2px; background-color: #cb8e71; position: absolute; bottom: -10px; left: 0; }

.top.master 			{ width: 100%; max-width: 1400px; padding-top: 30px; padding-bottom: 50px; background-color: #fff; }
.top.master>figure 		{ margin-top: 8px; }
.top.master>div 		{ margin-top: 20px; padding: 0 5%; }
.top.master>div h3 		{ margin-bottom: 15px; font-size: 1rem; line-height: 1.7; }
.top.master>div p 		{ line-height: 1.7; font-size: .9rem; text-align: justify; }
.top.master>div>div 	{ margin-top: 20px; padding: 20px 15px 20px; border: 2px solid #8cd059; border-radius: 10px; background-color: #fff; font-size: .9rem; }
.top.master>div>div dl 	{  }
.top.master>div>div dl>div{ width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; line-height: 1.5; }
.top.master>div>div dl>div:nth-of-type(2n){ margin-top: 5px; }
.top.master>div>div dl>div dt{ width: 5em; font-weight: 700; color: #7cc156; }
.top.master>div>div dl>div dd{ width: calc(100% - 6.2em); margin-left: auto; }

.list 					{ width: 100%; padding: 50px 5%; background-color: #f9f7f3; }
.list li 				{  }
.list li:nth-of-type(2n){  }
.list li:nth-of-type(n+2){ margin-top: 20px; }
.list li p 				{ margin-top: 10px; font-size: .9rem; text-align: center; }
}