@charset "utf-8";

body{background:#fff}
#contents.prd section.homepage.seo.section{position: relative}
#contents.prd section.homepage.seo.section h2{text-align: center; font-weight: 600}
html.zh #contents.prd section.homepage.seo.section h2{word-break: break-all}
#contents.prd section.homepage.seo.section ul.seo-ul{flex-wrap:wrap}
#contents.prd section.homepage.seo.section li.seo-ul-li:nth-child(1) div.seo-ul-li-in{background-color: #05B295}
#contents.prd section.homepage.seo.section li.seo-ul-li:nth-child(2) div.seo-ul-li-in{background-color: #0577B2}
#contents.prd section.homepage.seo.section li.seo-ul-li:nth-child(3) div.seo-ul-li-in{background-color: #32586B}
#contents.prd section.homepage.seo.section div.seo-ul-li-in{border-radius: 20px}
#contents.prd section.homepage.seo.section h3.seo-ul-li-in-text-h3{color: #fff}
#contents.prd section.homepage.seo.section p.seo-ul-li-in-text-p{line-height: 160%; color: #fff}

@media screen and (max-width:428px){
	#contents.prd section.homepage.seo.section li.seo-ul-li{width:100%}
}
@media screen and (min-width:429px) and (max-width:767px){
	#contents.prd section.homepage.seo.section li.seo-ul-li{width: calc(100% / 2 - 20px)}
}
@media screen and (max-width:767px){
	#contents.prd section.homepage.seo.section ul.seo-ul{justify-content: center}
}
@media screen and (min-width:768px) and (max-width:1280px){
	#contents.prd section.homepage.seo.section li.seo-ul-li{width: calc(100% / 3 - 20px)}
}
@media screen and (max-width:1280px){
	#contents.prd section.homepage.seo.section h2{margin-bottom: 30px}
	#contents.prd section.homepage.seo.section ul.seo-ul{display: flex; margin: -10px}
	#contents.prd section.homepage.seo.section li.seo-ul-li{padding: 10px; display: flex}
	#contents.prd section.homepage.seo.section div.seo-ul-li-in{padding: 30px; box-sizing: border-box; width: 100%}
	#contents.prd section.homepage.seo.section div.seo-ul-li-in-img{display: flex; align-items: center; aspect-ratio: 1 / 1; margin-bottom: 20px}
	#contents.prd section.homepage.seo.section div.seo-ul-li-in-img img{width: 100%}
	#contents.prd section.homepage.seo.section h3.seo-ul-li-in-text-h3{text-align:center; font-size: 18px; margin-bottom: 10px}
	#contents.prd section.homepage.seo.section p.seo-ul-li-in-text-p{text-align:center; font-size: 1.07rem}
}
@media screen and (min-width:1281px){
	#contents.prd section.homepage.seo.section:before{content: ''; background: url(/image/prd0/seo_backimg.png) no-repeat -10% 0; width: 500px; height: 444px; position: absolute; left: -3%; top: 5%; z-index: -1}
	#contents.prd section.homepage.seo.section{max-width: 1640px; width:100%; box-sizing: border-box; margin: 0 auto; padding: 300px 20px 100px}
	#contents.prd section.homepage.seo.section h2{margin-bottom: 50px}
	#contents.prd section.homepage.seo.section li.seo-ul-li{padding: 25px 0}
	#contents.prd section.homepage.seo.section div.seo-ul-li-in{height: 320px; display: flex; justify-content: center; align-items: center}
	#contents.prd section.homepage.seo.section div.seo-ul-li-in-img{display: flex; justify-content: center; width: 50%}
	#contents.prd section.homepage.seo.section div.seo-ul-li-in-text{width: 50%}
	#contents.prd section.homepage.seo.section h3.seo-ul-li-in-text-h3{font-size: 30px; margin-bottom: 20px}
	#contents.prd section.homepage.seo.section p.seo-ul-li-in-text-p{font-size: 1.13rem; white-space:pre-line}
	
}

#contents.prd section.homepage.markup.section{padding: 0}
#contents.prd section.homepage.markup.section div.markup{display: flex; width: 100%; box-sizing: border-box; flex-wrap:wrap}
#contents.prd section.homepage.markup.section div.markup-box{background-color: var(--color-background-secondary); border-radius: 30px; box-sizing: border-box;}
html.zh #contents.prd section.homepage.markup.section h3.markup-box-h3{word-break: break-all}
#contents.prd section.homepage.markup.section div.markup-title{flex: 1}
#contents.prd section.homepage.markup.section h2.markup-title-h2{font-weight: 600}
#contents.prd section.homepage.markup.section span.markup-title-span{display: block; color: var(--color-tertiary)}
#contents.prd section.homepage.markup.section p.markup-box-p{line-height: 160%}
html.zh #contents.prd section.homepage.markup.section p.markup-box-p{word-break: break-all}

#contents.prd section.homepage.markup.section div.markup2{background-color: var(--color-secondary)}
#contents.prd section.homepage.markup.section h2.markup-title2-h2{font-weight: 600; color: #fff; text-align: center}
#contents.prd section.homepage.markup.section div.markup-title2 span.markup-title-span{text-align: center}
#contents.prd section.homepage.markup.section p.markup-title-p{text-align: center; color: #fff; line-height: 160%}
html.zh #contents.prd section.homepage.markup.section p.markup-title-p{word-break: break-all}
#contents.prd section.homepage.markup.section div.markup2-box-in{border: 1px solid #506682; background-color: #2f4561;}
#contents.prd section.homepage.markup.section h3.markup2-box-h3{text-align: center; color: #fff}
#contents.prd section.homepage.markup.section div.markup2-box-list{text-align: center}
#contents.prd section.homepage.markup.section span.markup2-box-list-span{display: block; background-color: #fff; color: var(--color-secondary); width: fit-content; margin: 0 auto; border-radius: 500px; font-weight: 600}
#contents.prd section.homepage.markup.section p.markup2-box-list-p{color: #fff}

@media screen and (max-width:767px){
	#contents.prd section.homepage.markup.section h2.markup-title-h2{text-align: center}
	#contents.prd section.homepage.markup.section span.markup-title-span{text-align: center}
	#contents.prd section.homepage.markup.section div.markup-box{margin-top:30px}
	#contents.prd section.homepage.markup.section div.markup2{padding: 50px 30px}
}
@media screen and (min-width:768px) and (max-width:1280px){
	#contents.prd section.homepage.markup.section div.markup-box{width: 50%; margin-left: 3.33rem}
	#contents.prd section.homepage.markup.section div.markup2{padding: 3.33rem}
}
@media screen and (max-width:1280px){
	#contents.prd section.homepage.markup.section div.markup{margin:0 auto 3.33rem; padding: 0 0.8em}
	#contents.prd section.homepage.markup.section div.markup-title{margin-top: 10px}
	#contents.prd section.homepage.markup.section h2.markup-title-h2{margin-bottom: 5px}
	#contents.prd section.homepage.markup.section span.markup-title-span{font-size: 1.2rem}
	#contents.prd section.homepage.markup.section div.markup-box{padding: 2rem}
	#contents.prd section.homepage.markup.section h3.markup-box-h3{text-align: center; font-size: 1.47rem; margin-bottom: 1rem}
	#contents.prd section.homepage.markup.section p.markup-box-p{text-align: center; font-size: 1.07rem}
	#contents.prd section.homepage.markup.section div.markup2-box{margin-top:2rem}
	#contents.prd section.homepage.markup.section p.markup-title-p{margin-top: 1.33rem}
	#contents.prd section.homepage.markup.section div.markup2-box-in{padding: 2rem 1.33rem 1.33rem}
	#contents.prd section.homepage.markup.section h3.markup2-box-h3{font-size: 1.33rem; margin-bottom: 1.33rem}
	#contents.prd section.homepage.markup.section span.markup2-box-list-span{margin-bottom: 5px; padding: 3px 10px; font-size: 14px}
	#contents.prd section.homepage.markup.section p.markup2-box-list-p{margin-bottom: 1.33rem}
}
@media screen and (min-width:1281px){
	#contents.prd section.homepage.markup.section div.markup{margin:0 auto 6.25rem; max-width: 1640px; box-sizing: border-box; padding: 0 1.25rem}
	#contents.prd section.homepage.markup.section div.markup-title{margin-top: 1.25rem}
	#contents.prd section.homepage.markup.section h2.markup-title-h2{margin-bottom: 1.25rem; text-align:left}
	#contents.prd section.homepage.markup.section span.markup-title-span{font-size: 1.62rem}
	#contents.prd section.homepage.markup.section div.markup-box{width: 50%; padding: 3.12rem; margin-left: 6.25rem}
	#contents.prd section.homepage.markup.section h3.markup-box-h3{font-size: 1.87rem; margin-bottom: 1.25rem}
	#contents.prd section.homepage.markup.section p.markup-box-p{font-size: 1.13rem; white-space: pre-line}
	
	#contents.prd section.homepage.markup.section div.markup2{padding: 12.5rem 0}
	#contents.prd section.homepage.markup.section p.markup-title-p{margin-top: 3.12rem; font-size: 1.13rem; white-space: pre-line}
	#contents.prd section.homepage.markup.section div.markup2-box{max-width: 1600px; margin: 3.12rem auto; padding: 0 3.12rem; margin-top: 3.12rem}
	#contents.prd section.homepage.markup.section div.markup2-box-in{padding: 5rem 1.25rem 3.12rem}
	#contents.prd section.homepage.markup.section h3.markup2-box-h3{font-size: 1.87rem; margin-bottom: 3.12rem}
	#contents.prd section.homepage.markup.section div.markup2-box-list{font-size: 1.13rem}
	#contents.prd section.homepage.markup.section span.markup2-box-list-span{padding: 3px 0.94rem; margin-bottom: 10px}
	#contents.prd section.homepage.markup.section p.markup2-box-list-p{margin-bottom: 1.87rem}
}

#contents.prd section.homepage.meta.section{width: 1640px; max-width: 100%; margin: 0 auto; box-sizing: border-box}
#contents.prd section.homepage.meta.section h2.meta-title-h2{font-weight: 600}
#contents.prd section.homepage.meta.section ul.meta-list-ul{display: flex; flex-wrap: wrap}
#contents.prd section.homepage.meta.section li.meta-list-ul-li{display: flex; align-items: center; justify-content: center}
#contents.prd section.homepage.meta.section div.meta-list-ul-li-in{background-color: var(--color-background-secondary); width: 100%; height: 100%; border-radius: 20px; box-sizing: border-box; display: flex; justify-content: center; align-items: center}
#contents.prd section.homepage.meta.section p.meta-list-ul-li-in-p{text-align: center; line-height: 160%}
html.zh #contents.prd section.homepage.meta.section p.meta-list-ul-li-in-p{word-break:break-all}
#contents.prd section.homepage.meta.section span.meta-list-ul-li-in-p-span{font-weight: 600}

#contents.prd section.homepage.meta.section h2.meta-title2-h2{text-align: center; font-weight: 600}
html.zh #contents.prd section.homepage.meta.section h2.meta-title2-h2{word-break:break-all}
#contents.prd section.homepage.meta.section ul.search-ul{display: flex; flex-wrap: wrap}
#contents.prd section.homepage.meta.section li.search-ul-li{display: flex}
#contents.prd section.homepage.meta.section div.search-ul-li-in{width: 100%; background-color: #fff; border: 1px solid #EFEEF5; box-shadow: 0 0 10px rgb(6 0 84 / 8%); border-radius: 20px}
#contents.prd section.homepage.meta.section h3.search-ul-li-in-h3{font-weight: 600}
html.zh #contents.prd section.homepage.meta.section h3.search-ul-li-in-h3{word-break:break-all}
#contents.prd section.homepage.meta.section div.search-ul-li-in-icon{display: flex; justify-content: left; align-items: center; aspect-ratio: 1 / 1}
#contents.prd section.homepage.meta.section div.search-ul-li-in-icon img{width: 100%}

#contents.prd section.homepage.meta.section div.box{background-color: #222; border-radius: 20px}
#contents.prd section.homepage.meta.section h3.box-h3{text-align: center; white-space: pre-line; color: #fff; line-height: 180%}
html.zh #contents.prd section.homepage.meta.section h3.box-h3{word-break:break-all}
@media screen and (max-width:1280px){
	#contents.prd section.homepage.meta.section{padding-top: 6.67rem; padding-bottom: 0;}
	#contents.prd section.homepage.meta.section h2.meta-title-h2{text-align:center; margin-bottom: 1.33rem}
	#contents.prd section.homepage.meta.section ul.meta-list-ul{margin: -10px}
	#contents.prd section.homepage.meta.section li.meta-list-ul-li{width: calc(100% / 2 - 1.33rem); padding: 10px; flex: 1 1 auto}
	#contents.prd section.homepage.meta.section div.meta-list-ul-li-in{padding: 2rem}
	#contents.prd section.homepage.meta.section p.meta-list-ul-li-in-p{font-size: 1.07rem}
	
	#contents.prd section.homepage.meta.section div.meta-list{margin-bottom: 6.67rem}
	
	#contents.prd section.homepage.meta.section h2.meta-title2-h2{margin-bottom: 2rem}
	#contents.prd section.homepage.meta.section ul.search-ul{margin: -10px}
	#contents.prd section.homepage.meta.section li.search-ul-li{width: calc(100% / 2 - 20px); padding: 10px}
	#contents.prd section.homepage.meta.section div.search-ul-li-in{padding: 2rem}
	#contents.prd section.homepage.meta.section h3.search-ul-li-in-h3{font-size: 1.33rem}
	#contents.prd section.homepage.meta.section div.search-ul-li-in-icon{width: 2.67rem; margin-bottom: 1rem}
	
	#contents.prd section.homepage.meta.section div.box{margin-top: 6.67rem; padding: 3.33rem 1.33rem}
	#contents.prd section.homepage.meta.section h3.box-h3{font-size: 1.33rem}
}
@media screen and (min-width:1281px){
	#contents.prd section.homepage.meta.section{padding-top: 12.5rem}
	#contents.prd section.homepage.meta.section h2.meta-title-h2{margin-bottom: 1.87rem}
	#contents.prd section.homepage.meta.section ul.meta-list-ul{margin: -1.56rem}
	#contents.prd section.homepage.meta.section li.meta-list-ul-li{width: calc(100% / 3 - 3.13rem); padding: 1.56rem}
	#contents.prd section.homepage.meta.section div.meta-list-ul-li-in{padding: 3.12rem}
	#contents.prd section.homepage.meta.section p.meta-list-ul-li-in-p{font-size: 1.13rem}

	#contents.prd section.homepage.meta.section div.meta-list{margin-bottom: 12.5rem}
	
	#contents.prd section.homepage.meta.section h2.meta-title2-h2{margin-bottom: 3.12rem}
	#contents.prd section.homepage.meta.section ul.search-ul{margin: -0.94rem}
	#contents.prd section.homepage.meta.section li.search-ul-li{width: calc(100% / 2 - 1.88rem); padding: 0.94rem}
	#contents.prd section.homepage.meta.section div.search-ul-li-in{padding: 3.12rem}
	#contents.prd section.homepage.meta.section h3.search-ul-li-in-h3{font-size: 1.87rem}
	#contents.prd section.homepage.meta.section div.search-ul-li-in-icon{width: 3.87rem; margin-bottom: 1.25rem}
	
	#contents.prd section.homepage.meta.section div.box{margin-top: 12.5rem; padding: 6.25rem 1.25rem}
	#contents.prd section.homepage.meta.section h3.box-h3{font-size: 1.87rem}
}