@charset "UTF-8";
/* -----

ODM OEM PB

------------------------------------*/
.enlink, .odminq1, .odminq2{ margin-bottom: 2.5em}
.enlink a{ border-bottom: 2px solid #4F8EC0; padding: 0 0 5px}
.odminq1 a, .odminq2 a{ border-radius: 4px; width: 60%; padding: 17px; margin: 0 auto 30px; display: block}
.odminq1 a{ background: #4F8EC0; color: #fff}
.odminq2 a{ border: 1px solid #4F8EC0;}
.odminq2 span{ font-size: .8em}

ul.ulodm1, ul.ulodm2{ gap: 40px 4%; flex-wrap: wrap}
ul.ulodm1 li{ width: 48%; padding: 4%; color: #fff; border-radius: 6px; background-color: #4798d6; background-image: linear-gradient(132deg, #1180d5 0%, #099aa2 100%)}
ul.ulodm2 li{ width: 48%; padding: 4% 4% 2%; border-radius: 8px}
ul.ulodm2 li:first-child{ border: 3px solid #4bb1e3; background-size: auto auto; background-color: rgba(255, 255, 255, 1); background-image: repeating-linear-gradient(135deg, transparent, transparent 10px, rgba(250, 251, 255, 1) 10px, rgba(250, 251, 255, 1) 50px )}
ul.ulodm2 li:last-child{ border: 3px solid #6ab9c1;background-size: auto auto; background-color: rgba(255, 255, 255, 1); background-image: repeating-linear-gradient(135deg, transparent, transparent 10px, rgba(250, 254, 255, 1) 10px, rgba(250, 254, 255, 1) 50px )}
ul.ulodm2 li h3 span{ background:linear-gradient(transparent 40%, #fff343 40%)}

ul.ulodmstep{ margin: 2em 0; position: relative;}
ul.ulodmstep li{ padding: 0 0 1.3em 2em; margin: 0; position: relative}
ul.ulodmstep li::before{ content: ""; display: block; width: 18px; height: 18px; background: #4798d6; border: solid 3px #ffffff; border-radius: 50%; position: absolute; top: 6px; left: 3px; box-shadow: 0 0 0 2px #4798d6}
ul.ulodmstep li::after{ content: ""; display: block; height: calc(100% - 35px); border-left: dotted 5px #b5b5b5; position: absolute; top: 30px; left: 10px}
ul.ulodmstep li:nth-child(1)::before{ background: #74c65e; box-shadow: 0 0 0 2px #74c65e}
ul.ulodmstep li:nth-child(2)::before{ background: #61c65e; box-shadow: 0 0 0 2px #61c65e}
ul.ulodmstep li:nth-child(3)::before{ background: #5ec68c; box-shadow: 0 0 0 2px #5ec68c}
ul.ulodmstep li:nth-child(4)::before{ background: #4db3a4; box-shadow: 0 0 0 2px #4db3a4}
ul.ulodmstep li:nth-child(5)::before{ background: #0a97ae; box-shadow: 0 0 0 2px #0a97ae}
ul.ulodmstep li:nth-child(6)::before{ background: #045fbf; box-shadow: 0 0 0 2px #045fbf}
ul.ulodmstep li strong{ font-weight: bold; font-size: 1.2em; margin-bottom: .5em; display: block}
ul.ulodmstep li span{ font-size: .9em; letter-spacing: .1em}
ul.ulodmstep li:nth-child(-n+2) span{ color: #61c65e}
ul.ulodmstep li:nth-child(n+3):nth-child(-n+4) span{ color: #4db3a4}
ul.ulodmstep li:nth-child(n+5) span{ color:#045fbf}
ul.ulodmstep > :last-of-type::after { display: none}

.odmpic{ justify-content: space-between; margin-bottom: 20px; align-items: flex-start}
.odmpic > div/*, .odmpic img*/{ width: 33%; padding-top: 1em}
.odmpic img{ width: 100%}

.odmtopcaseph{ gap: 3%; background: #fff}
.odmtopcaseph div{ width: 48.5%}


/* -----

ODM OEM PB　下層ページ

------------------------------------*/
h2.h2case{ font-size: 1.5em; margin-bottom: 1em; color: #1b7366}
.case-ivw{ padding: 3%; border-radius: 6px; background: #f8fbf7; width: 80%; margin: 0 auto}
dl.dlcaseiv{ width: 80%; margin: 0 auto}
dl.dlcaseiv dt{ text-align: center; color: #1b7366}
.case-iv{ gap: 6%; margin: 1em 0}
.case-iv img, .odmtopcaseph img{ width: 100%}
.case-iv div{ width: 47%}



/* -----

ESS

------------------------------------*/
dl.essmerit{ margin: 0 0 40px}
dl.essmerit dt{ font-weight: bold}
dl.essmerit dt::before{ margin-right: 5px; vertical-align: middle; font: var(--fa-font-thin); font-size: 2em}
dl.essmerit dt:nth-of-type(1)::before{ content: "\e0ee"; color: #1485df}
dl.essmerit dt:nth-of-type(2)::before{ content: "\e0ef"; color: #14b5a6}
dl.essmerit dt:nth-of-type(3)::before{ content: "\e0f0"; color: #f28b07}
dl.essmerit dt:nth-of-type(4)::before{ content: "\e0f1"; color: #f96775}
dl.essmerit dt:nth-of-type(5)::before{ content: "\e0f2"; color: #d933bf}
dl.essmerit dd{ margin: .5em 0 2em 2em}
dl.essmerit dd::before{ margin-right: 5px; vertical-align: middle; font: var(--fa-font-thin); font-size: 1.5em}
dl.essmerit dd:nth-of-type(1)::before{ content: "\f061"; color: #1485df}
dl.essmerit dd:nth-of-type(2)::before{ content: "\f061"; color: #14b5a6}
dl.essmerit dd:nth-of-type(3)::before{ content: "\f061"; color: #f28b07}
dl.essmerit dd:nth-of-type(4)::before{ content: "\f061"; color: #f96775}
dl.essmerit dd:nth-of-type(5)::before{ content: "\f061"; color: #d933bf}


@media (max-width: 767px) {
ul.ulodm1 li, ul.ulodm2 li{ width: 92%; margin: 0 auto}
.odminq1 a, .odminq2 a, dl.dlcaseiv{ width: 90%}
.case-ivw{ width: 100%}
}