@charset "utf-8";

/*-----------------------------フォント*/
@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100..700;1,100..700&family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');

/*-----------------------------リセットCSS*/
html {
	box-sizing: border-box;
	-ms-overflow-style: scrollbar;
    overflow-x: hidden;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

/* Remove default padding */

ul[class],
ol[class] {
	padding: 0;
}

/* Remove default margin */

body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
ul[class],
ol[class],
figure,
blockquote,
dl,
dd {
	margin: 0;
}

/* Set core root defaults */

html {
	scroll-behavior: smooth;
}

/* Set core body defaults */

body {
	min-height: 100vh;
	text-rendering: optimizeSpeed;
	line-height: 100%;
}

/* Remove list styles on ul, ol elements with a class attribute */

ul[class],
ol[class] {
	list-style: none;
    padding: 0;
    margin: 0;
}

ul,
ol {
	list-style: none;
    padding: 0;
    margin: 0;
}

/* A elements that don't have a class get default styles */

a:not([class]) {
	-webkit-text-decoration-skip: ink;
	text-decoration-skip-ink: auto;
}

/* Make images easier to work with */

img {
	max-width: 100%;
	display: block;
}

/* Natural flow and rhythm in articles by default */

article > * + * {
	margin: 0;
}

/* Inherit fonts for inputs and buttons */

input,
button,
textarea,
select {
	font: inherit;
}

/* Blur images when they have no alt attribute */

/* Remove all animations and transitions for people that prefer not to see them */

img {
	height: auto;
}

picture {
    display: block;
}

address,
em {
	font-style: normal;
}

table {
	border-collapse: collapse;
}

input[type="text"],
input[type="tel"],
input[type="email"],
input[type="password"],
input[type="number"],
textarea {
	-webkit-appearance: none;
	border-radius: 0;
}

input[type="search"],
input[type="submit"],
input[type="button"] {
	-webkit-appearance: button;
	-moz-appearance: button;
	appearance: button;
	box-sizing: border-box;
	cursor: pointer;
}

input[type="search"]::-webkit-search-decoration,
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
	display: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Josefin Sans", sans-serif;
	clear: both;
	font-weight: normal;
}

/*-----------------------------初期値CSS*/
body {
    font-family: "Open Sans", sans-serif;
	font-size: 16px;
    font-weight: 400;
	line-height: 1.8;
    position: relative;
    background: #fff;
    color: #000;
    overflow-x: hidden;
    white-space: normal;
    overflow-wrap: break-word;
    word-break: break-word;
}

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

    body {
        font-size: 15px;
        line-height: 1.7;
    }

}

body a {
    transition: .2s;
	text-decoration: none;
    color: #000;
	display: block;
	cursor: pointer;
    -webkit-text-decoration: none;
}

ul {
	margin: 0;
	padding: 0;
}

li {
	list-style: none;
}

.clearfix::after {
	content: "";
	display: block;
	clear: both;
}

a[href*="tel:"] {
    display: inline;
}

.content ul,
.content ol,
.content li {
	list-style: normal;
}

.content h1,
.content h2,
.content h3,
.content h4,
.content h5,
.content h6 {
	margin-top: 50px;
}

/*スマホ時電話リンク*/
@media (min-width: 599px) {
	a[href*="tel:"] {
        pointer-events: none;
        cursor: default;
        text-decoration: none;
	}
}

/*iPhoneで画面サイズに合わせる*/
@supports (-webkit-touch-callout: none) {
    html {
        height: -webkit-fill-available;
    }
    body {
        min-height: 100vh;
        min-height: -webkit-fill-available;
    }
}

/*-----------------------------共通CSS*/
main.main {
    position: relative;
    z-index: 1;
}

.flex {
    display: flex;
    flex-wrap: wrap;
}

.inner,
ul.inner {
    max-width: 1200px;
    width: calc(100% - 96px);
    margin: 0 auto;
    box-sizing: border-box;
}

.inner2,
ul.inner2 {
    max-width: 900px;
}

.sp {
    display: none;
}

.blue {
    color: #0071BC;
}

.red {
    color: #E72B2E;
}

.textCenter {
    text-align: center;
}

.textRight {
    text-align: right;
}

.wbr {
    word-break: keep-all;
    white-space: nowrap;
}

hr {
    height: 1px;
    border: none;
}

.img img,
.img video,
.img iframe {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/*modBtn1*/
.modBtn1 {
    position: relative;
    width: 100%;
    height: 100%;
    max-width: 150px;
}

.modBtn1 a {
    position: relative;
    font-family: "Josefin Sans", sans-serif;
    font-weight: 600;
    line-height: 1;
    height: 100%;
    width: 100%;
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 40px;
    background-color: #0071BC;
    border: 1px solid #0071BC;
    color: #fff;
    padding: 3px 10px 0 10px;
}

/*modBtn2*/
.modBtn2 {
    position: relative;
    width: 100%;
    height: 100%;
    max-width: 220px;
}

.modBtn2.center {
    margin: 30px auto;
}

.modBtn2 a,
.content .modBtn2 a {
    position: relative;
    font-family: "Josefin Sans", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1;
    height: 100%;
    width: 100%;
    min-height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 40px;
    padding: 0 45px;
    background: url(./img/common/icon-right-white.svg) no-repeat center right 20px;
    background-size: 15px;
    background-color: #0071BC;
    border: 1px solid #0071BC;
    color: #fff;
    padding-top: 3px;
    text-decoration: none;
}

.content .modBtn2 a:hover {
    opacity: 1;
}

/*modBtn3*/
.modBtn3 a {
    font-size: 16px;
    border: none;
    background-image:
        url(./img/common/icon-right-white.svg),
        linear-gradient(90deg, #88AAB9 0%, #2A5CAA 80%);
    background-repeat: no-repeat, no-repeat;
    background-position: center right 20px, center;
    background-size: 15px, cover;
}

/*modBtn4*/
.modBtn4 {
    position: relative;
    width: 100%;
    height: 100%;
    max-width: 220px;
    background: linear-gradient(90deg, #88AAB9 0%, #2A5CAA 80%);
    border-radius: 40px;
    padding: 1px;
}

.modBtn4.center,
.content .modBtn4.center {
    margin: 30px auto 0 auto;
}

.modBtn2.center,
.content .modBtn4.center {
    margin-bottom: 50px;
}

.modBtn4 a,
.content .modBtn4 a {
    position: relative;
    font-family: "Josefin Sans", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1;
    height: 100%;
    width: 100%;
    min-height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 40px;
    padding: 0 37px;
    background: url(./img/common/icon-right-blue.svg) no-repeat center right 20px;
    background-size: 15px;
    background-color: #fff;
    color: #fff;
    padding-top: 3px;
    text-decoration: none;
}

.content .modBtn4 a:hover {
    opacity: 1;
}

.modBtn4 a .textGrd {
    font-family: "Josefin Sans", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1;
    transition: .2s;
}

/*formBtn*/
.formBtn {
    position: relative;
    min-height: 50px;
    border-radius: 40px;
    background-image:
        url(./img/common/icon-right-white.svg),
        linear-gradient(90deg, #88AAB9 0%, #2A5CAA 80%);
    background-repeat: no-repeat, no-repeat;
    background-position: center right 20px, center;
    background-size: 15px, cover;
    transition: .2s;
}

.formBtn input[type="submit"] {
    position: relative;
    z-index: 1;
    min-height: 50px;
    border-radius: 0;
    border: none;
    width: 100%;
    height: 100%;
    background: none;
    padding: 0;
    color: transparent; 
}

.formBtn .btnInner {
    content: "";
    position: absolute;
    top: calc(50% + 3px);
    left: 0;
    transform: translateY(-50%);
    margin: auto;
    width: 100%;
    font-family: "Josefin Sans", sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    color: #fff;
    padding: 0 45px;
    transition: .2s;
}

.modBtn1 a:hover,
.modBtn2 a:hover {
    color: #fff;
}

/*hover*/
@media screen and (min-width: 1024px){

    .modBtn1 a:hover {
        background-color: #fff;
        color: #0071BC;
    }

    .modBtn2 a:hover {
        background-image: url(./img/common/icon-right-blue.svg);
        background-color: #fff;
        color: #0071BC;
    }

    .formBtn:hover {
        background-image: url(./img/common/icon-right-blue.svg);
        background-color: #fff;
        color: #0071BC;
    }

    /*modBtn4*/
    .modBtn4 a:hover {
        background: url(./img/common/icon-right-white.svg) no-repeat center right 20px;
        background-color: rgba(255,255,255,0);
    }

    .modBtn4 a:hover .textGrd {
        background: none;
        color: #fff;
        -webkit-background-clip: inherit;
        -webkit-text-fill-color: inherit;
    }

    .formBtn:hover {
        background-image: url(./img/common/icon-right-blue.svg);
        background-color: #fff;
    }

    .formBtn:hover .btnInner {
        color: #0071BC;
    }

}

/*sectionTitle*/
.sectionTitle {
    position: relative;
    font-family: "Josefin Sans", sans-serif;
    font-size: 50px;
    font-weight: 600;
    line-height: 1.2;
    text-align: center;
    margin-bottom: 40px;
    transition: .2s;
}

.sectionTitle:has(a:hover) {
    opacity: .7;
}

/*sectionTitleText*/
.sectionTitleText {
    text-align: center;
    margin: 50px 0;
}

/*textGrd*/
.textGrd {
  display: inline-block;
  background: linear-gradient(90deg, #88AAB9 0%, #2A5CAA 80%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/*sectionBg*/
.section {
    position: relative;
    margin-bottom: 100px;
}

.bg {
    padding: 80px 0;
}

.bgGray {
    background-color: #F5F5F5;
}

.bgBlue {
    background-color: #0071BC;
}

.hr {
    background-color: #CCCCCC;
    margin: 40px 0;
}

.content img {
    margin: 20px 0;
    width: 100%;
}

/*タイトル*/
.h3 {
    position: relative;
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 20px;
    line-height: 1.4;
}

.pageSection .h3 {
    font-size: 25px;
    line-height: 1.3;
}

/*ul*/
.list li {
    position: relative;
    padding-left: 1em;
}

.list li::before {
    content: "・";
    position: absolute;
    top: 0;
    left: 0;
    font-weight: 700;
}

/*textLink*/
.content a,
.textLink {
    display: inline;
    text-decoration: underline;
    color: #0071BC;
}

.content a:hover,
.textLink:hover {
    text-decoration: none;
    opacity: .7;
}

/*table*/
.table,
.table th,
.table td {
	border-collapse: collapse;
}

.table {
    width: 100%;
    border-color: #CECECE !important;
}

.table tr {
    border-color: #CECECE;
}

.table th,
.table td {
    border: none;
    line-height: 1.5;
    table-layout: fixed;
    text-align: left;
}

.table th {
    font-weight: 500;
}

.content .table h1,
.content .table h2,
.content .table h3,
.content .table h4,
.content .table h5,
.content .table h6 {
    margin: 0;
}

/*table1,table2*/
.table1 th,
.table1 td {
    vertical-align: top;
}

.table1 th {
    font-family: "Josefin Sans", sans-serif;
    font-size: 18px;
    font-weight: 500;
    width: 280px;
    padding: 27px 15px 30px 0 !important;
}

.table1 td {
    width: calc(100% - 280px);
    padding: 30px 0 !important;
}

.table2 th,
.table2 td {
    vertical-align: middle;
    padding: 20px 0;
}

.table2 tr:last-child th,
.table2 tr:last-child td {
    vertical-align: top;
}

.table2 th {
    width: 277px;
}

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

    .inner,
    ul.inner {
        width: calc(100% - 32px);
    }

}

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

    .pc {
        display: none;
    }

    .sp {
        display: block;
    }

    /*sectionBg*/
    .section {
        border-radius: 30px 30px 0 0;
    }

    .bg {
        padding: 50px 0;
    }

    .hrInner {
        width: 100%;
    }

    .h3 {
        font-size: 17px;
        margin-bottom: 15px;
    }

    .pageSection .h3 {
        font-size: 20px;
    }

    /*modBtn1*/
    .modBtn1 {
        margin: 0 auto;
        max-width: 311px;
    }

    .modBtn1 a {
        min-height: 50px;
    }

    /*table1*/
    .table1 th,
    .table1 td {
        border: none;
        vertical-align: top;
        padding: 18px 0;
        line-height: 1.5;
    }

    .table1 th {
        display: block;
        width: 100%;
        padding: 20px 0 10px 0 !important;
        border-bottom: none;
    }

    .table1 th h4 {
        font-size: 23px;
    }

    .table1 td {
        display: block;
        width: 100%;
        padding: 0 0 20px 0 !important;
    }

    .table2 th,
    .table2 td {
        vertical-align: middle;
        padding: 20px 0;
    }

    /*sectionTitle*/
    .pageSection .sectionTitle {
        font-size: 30px;
        line-height: 1.4;
        margin-bottom: 30px;
    }

}

/*--------------------------------------------------------------------------------------------------------------------

ヘッダー

--------------------------------------------------------------------------------------------------------------------*/
.header {
    position: fixed;
    top: 20px;
    left: 0;
    width: 100%;
    z-index: 10;
    height: 70px;
}

.header .headerInner {
    width: calc(100% - 40px);
    height: 100%;
    margin: 0 auto;
    justify-content: space-between;
    align-items: center;
    padding: 0 30px;
    backdrop-filter: blur(20px);
    border-radius: 80px;
    background-color: rgba(255,255,255,.8);
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
} 

body.active .header .headerInner {
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0);
} 

/*-----------------------------左ロゴ*/
.header .logo .title {
    width: 100px;
    height: 40px;
    margin: 0;
}

.header .logo .title .text {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/*-----------------------------メニュー*/
/*nav*/
.header .nav {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: calc(100% - 130px);
}

.header .nav .navInner {
    position: relative;
    align-items: center;
    justify-content: flex-end;
    column-gap: 25px;
    height: 70px;
}

.header .nav .main {
    position: relative;
    font-family: "Josefin Sans", sans-serif;
    font-size: min(16px,1.1111111111111112vw);
    padding: 8px 0;
}

.header .icon a {
    color: #0071BC;
}

.header .nav li.modBtn1 {
    margin-right: 146px;
    max-height: 40px;
}

.header .nav li.gtranslateBtn {
    position: absolute;
    top: 12px;
    right: 44px;
}

/*hover*/
@media screen and (min-width: 1024px){

    .header .logo a:hover,
    .header .icon a:hover {
        opacity: .7;
    }

    .header .nav .main:hover {
        color: #0071BC;
    }

}

/*@media screen and (max-width: 1557px){*/

    .header .headerInner {
        padding-right: 90px;
    }

    .header .nav li {
        display: none;
    }

    .header .nav li.modBtn1,
    .header .nav li.gtranslateBtn,
    .header .nav li.icon {
        display: block;
    }

/*}*/

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

    .header {
        top: 10px;
    }

    .header .headerInner {
        height: 50px;
        width: calc(100% - 32px);
        padding: 10px 16px;
    }

    .header .logo .title {
        width: auto;
        height: 30px;
        width: 75px;
    }

    .header .nav {
        display: none;
    }

    /*-----------------------------左ロゴ*/
    .header .logo .title .text {
        font-size: 25px;
    }

}

/*--------------------------------------------------------------------------------------------------------------------

ハンバーガーメニュー

--------------------------------------------------------------------------------------------------------------------*/
.hamburger {
	display: none;
}

/*----------------------------------------------------------------------三本ライン*/
.hamburger .line {
    position: fixed;
    top: 20px;
    right: 19px;
    display: flex;
    height: 70px;
    width: 70px;
    border-radius: 70px;
    justify-content: center;
    align-items: center;
    z-index: 999999;
	cursor: pointer;
    background-color: #0071BC;
}

.hamburger .line span,
.hamburger .line span:before,
.hamburger .line span:after {
    content: '';
    display: block;
    height: 1px;
    width: 20px;
    border-radius: 1px;
    background-color: #fff;
    position: absolute;
}

/*.line1*/
.hamburger .line span.line1:before {
    bottom: 5px;
    left: 0;
}

.hamburger .line span.line1:after {
    top: 5px;
    left: 0;
}

/*open*/
.hamburger .line.is-activeLine span.line1 {
    background-color: rgba(255, 255, 255, 0);/*メニューオープン時は真ん中の線を透明にする*/
}

.hamburger .line.is-activeLine span.line1::before {
    bottom: 0;
    transform: rotate(30deg);
}

.hamburger .line.is-activeLine span.line1::after {
    top: 0;
    transform: rotate(-30deg);
}

/* アニメーション前のメニューの状態 */
.hamburger .line.is-activeLine span.line1 {
    pointer-events: auto;
    opacity: 1;
}

/* アニメーション後のメニューの状態 */
.hamburger .line.is-activeLine span.line1 {
    pointer-events: none;
    opacity: 0;
}

.hamburger .line.is-activeLine span.line1 {
    pointer-events: none;
    opacity: 0;
}

/* アニメーション後のメニューの状態 */
.hamburger .line.is-activeLine span.line1 {
    pointer-events: auto;
    opacity: 1;
}

/*@media screen and (max-width: 1557px){*/

	.hamburger {
		display: block;
	}

/*}*/

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

    .hamburger .line {
        top: 10px;
        right: 16px;
        height: 50px;
        width: 50px;
    }

}

/*-----------------------------------------------------------------------中のメニュー*/
.hamburger .menu {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: scroll;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box; /* 追加 */
    z-index: 9;
    background-color: rgba(255, 255, 255, .7);
    backdrop-filter: blur(20px);
    padding: 20px;
    scrollbar-width: none; /* Firefox用 */
    -ms-overflow-style: none; /* IE・Edge旧対応 */
}

.hamburger .menu .menuInner {
    background-color: #fff;
    border-radius: 33px;
    padding: 110px 16px 50px 16px;
    min-height: 100%;
    text-align: center;
}

.hamburger .menu::-webkit-scrollbar {
    display: none; /* Chrome/Safari用 */
}

/*動き*/
/* アニメーション前のメニューの状態 */
.hamburger .menu {
    pointer-events: none;
    opacity: 0;
    transition: .2s;
}

/* アニメーション後のメニューの状態 */
.hamburger .menu.is-active {
    pointer-events: auto;
    opacity: 1;
}

/*menu*/
.hamburger .menu .navList {
    max-width: 568px;
    margin: 0 auto 20px auto;
}

.hamburger .menu .navList li {
    position: relative;
    text-align: left;
    border-bottom: 1px solid #eee;
}

.hamburger .menu .navList .subMenu {
    padding-bottom: 12.5px;
}

.hamburger .menu .navList .subMenu li {
    border-bottom: none;
}

.subMenu li a {
    position: relative;
    padding: 2.5px 0 2.5px 20px;
}

.subMenu li a::before {
    content: "";
    position: absolute;
    top: 16px;
    left: 0;
    width: 10px;
    height: 1px;
    background-color: #000;
}

.footer .subMenu li a::before {
    background-color: #fff;
}

.hamburger .menu .navList li a.main {
    position: relative;
    font-family: "Josefin Sans", sans-serif;
    font-size: 20px;
    padding: 15px 0 10px 0;
}

.navList .toggleBtn.icon {
    position: absolute;
    top: 19px;
    right: 10px;
    width: 24px;
    height: 24px;
    z-index: 2;
    cursor: pointer;
}

.navList .toggleBtn.icon::before,
.navList .toggleBtn.icon::after {
    content: "";
    position: absolute;
    background-color: #0071BC;
    border-radius: 2px;
}

.navList .toggleBtn.icon::before {
    left: 5px;
    top: 11px;
    width: 14px;
    height: 2px;
}

.navList .toggleBtn.icon::after {
    top: 5px;
    left: 11px;
    height: 14px;
    width: 2px;
}

.navList .toggleBtn.is-active.icon::after { /* アイコン縦棒なし（開いてるとき） */
    opacity: 0;
}

.hamburger .menu .child {
	display: none;
}

.hamburger .menu .telBtn,
.hamburger .menu .modBtn1 {
    max-width: 581px;
    margin: 0 auto 38px auto;
}

.hamburger .menu .text {
    display: block;
    font-size: 14px;
    text-decoration: underline;
    margin-top: 10px;
}

.hamburger .menu .modBtn1 {
    margin: 20px auto;
}

.hamburger .menu .iconList {
    margin: 20px 0;
    justify-content: center;
    column-gap: 20px;
}

.hamburger .menu .iconList .icon a {
    color: #0071BC;
}

/*hover*/
@media screen and (min-width: 1024px){

    .hamburger .menu .navList li a.main:hover,
    .hamburger .menu .subMenu li a:hover {
        color: #0071BC;
    }

    .hamburger .menu .text:hover {
        opacity: .7;
        text-decoration: none;
    }

}
@media screen and (min-width: 1024px){

    .hamburger .menu .modBtn1,
    .hamburger .menu .iconList,
    .hamburger .menu .gtranslateBtn {
        display: none;
    }

}

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

    .hamburger .menu {
        padding: 10px 16px 16px 16px;
    }

    .hamburger .menu .menuInner {
        padding: 70px 16px 50px 16px;
    }

}

/*--------------------------------------------------------------------------------------------------------------------

フッター
--------------------------------------------------------------------------------------------------------------------*/
/*ourPartners*/
.ourPartners {
    margin-top: 100px;
    padding: 100px 0;
    text-align: center;
    border-top: 1px solid #88AAB9;
}

.home .ourPartners,
.single-products .ourPartners,
.page-template-page-program .ourPartners {
    padding-top: 0;
    border-top: none;
}

.ourPartners .ourPartnersBy {
    text-align: left;
}

.ourPartners .subTitle {
    position: relative;
    font-family: "Josefin Sans", sans-serif;
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 30px;
    padding: 0 63px;
}

.ourPartners .subTitle::before {
    content: "";
    position: absolute;
    top: 8px;
    left: 0;
    width: 50px;
    height: 1px;
    background-color: #88AAB9;
}

.ourPartners .ourPartnersList {
    padding: 0 63px;
    justify-content: center;
    align-items: center;
    column-gap: 50px;
    row-gap: 50px;
}

.ourPartners .ourPartnersList li {
    max-width: 137px;
}

/*hover*/
@media screen and (min-width: 1024px){

    .ourPartners .ourPartnersList a:hover {
        opacity: .7;
    }

}

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

    .ourPartners {
        margin-top: 80px;
        padding: 80px 0;
    }

    .ourPartners .subTitle {
        padding: 0 30px;
    }

    .ourPartners .subTitle::before {
        width: 25px;
    }

    .ourPartners .ourPartnersList {
        padding: 0 30px;
        column-gap: 30px;
        row-gap: 30px;
    }
    
    .ourPartners .ourPartnersList li {
        width: calc(50% - 15px);
    }
    
    .ourPartners .ourPartnersList li img {
        margin: 0 auto;
    }

}

/*footer*/
.footer {
    position: relative;
    padding: 80px 0 20px 0;
    background-color: #0071BC;
}

/*dlSection*/
.dlSection {
    background-color: rgba(255,255,255,.8);
    border-radius: 30px;
    padding: 60px;
    align-items: center;
}

.dlSection .img {
    width: 24.6%;
}

.dlSection .text {
    width: 42.9%;
    padding: 0 50px;
}

.dlSection .text .sectionTitle {
    text-align: left;
    margin-bottom: 10px;
}

.dlSection .formSection {
    width: 32.5%;
    padding: 0 0 0 50px;
    border-left: 1px solid #88AAB9;
}

.dlSection .formSection .textRight {
    font-size: 14px;
    margin: 5px 0 10px 0;
}

.dlSection .formSection .formBtn {
    margin: 20px auto 0 auto;
    max-width: 300px;
}

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

    .dlSection .img {
        width: 50%;
    }

    .dlSection .text {
        width: 50%;
        padding: 0 0 0 30px;
    }

    .dlSection .formSection {
        width: 100%;
        margin-top: 50px;
        padding: 50px 0 0 0;
        border-left: none;
        border-top: 1px solid #88AAB9;
    }

}

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

    .dlSection .img.pc {
        display: none;
    }

    .dlSection .img.sp {
        display: block;
    }

    .dlSection .img {
        width: 100%;
        margin-bottom: 20px;
    }

    .dlSection .text {
        width: 100%;
        padding: 0;
    }

}

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

    .dlSection {
        border-radius: 20px;
        padding: 40px 16px;
    }

    .dlSection .formSection {
        margin-top: 30px;
        padding: 30px 0 0 0;
    }

    .dlSection .text .sectionTitle {
        font-size: 40px;
    }

}

/*hr*/
.footer hr {
    margin: 80px 0 50px 0;
    background-color: #fff;
}

/*footerMenu*/
.footerMenu {
    justify-content: space-between;
}

.footerMenu .left {
    width: 36%;
    color: #fff;
    padding-top: 15px;
}

.footerMenu .left .logo {
    display: inline-block;
}

.footerMenu .left .logo img {
    max-width: 100px;
}

.footerMenu .left .name {
    font-family: "Josefin Sans", sans-serif;
    font-size: 20px;
    font-weight: 600;
    margin: 25px 0 5px 0;
}

.footerMenu .left .iconList {
    column-gap: 20px;
    margin-top: 30px;
}

.footerMenu .left .address a,
.footerMenu .left .iconList a {
    color: #fff;
}

.footerMenu .middle {
    width: 36%;
    padding-top: 15px;
    justify-content: space-between;
    column-gap: 20px;
}

.footerMenu .middle li {
    margin-bottom: 30px;
}

.footerMenu .middle .subMenu li {
    margin-bottom: 0;
}

.footerMenu .middle a {
    color: #fff;
}

.footerMenu .middle a.main {
    font-family: "Josefin Sans", sans-serif;
    font-size: 20px;
}

/*hover*/
@media screen and (min-width: 1024px){

    .footerMenu .left .logo:hover,
    .footerMenu .middle a:hover,
    .footerMenu .left .iconList a:hover {
        opacity: .7;
    }

}

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

    .footerMenu .left {
        width: calc(100% - 300px);
    }

    .footerMenu .middle {
        display: none;
    }

}

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

    .footerMenu {
        justify-content: center;
        row-gap: 30px;
        margin-bottom: 20px;
    }

    .footerMenu .left {
        width: 100%;
    }

}

/*copy*/
.footer .copySection {
    color: #fff;
    font-size: 14px;
    margin-top: 20px;
    justify-content: flex-end;
    align-items: center;
}

.footer .link {
    padding: 0 15px;
    border-right: 1px solid #fff;
    text-decoration: underline;
    color: #fff;
    line-height: 1.3;
}

.footer .copySection p {
    margin-bottom: 0;
    margin-left: 15px;
}

/*hover*/
@media screen and (min-width: 1024px){

    .footer .link:hover {
        text-decoration: none;
        opacity: .7;
    }

}

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

    .footer .copySection {
        font-size: 13px;
        margin-top: 0;
        justify-content: center;
        align-items: center;
    }

    .footer .link {
        padding: 0;
        border-right: none;
        display: block;
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
    }

    .footer .copySection p {
        margin-top: 20px;
        margin-left: 0;
    }

}

/*--------------------------------------------------------------------------------------------------------------------

トップ・下層

--------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------MV*/
.mv {
    position: relative;
    margin-bottom: 100px;
}

.mv video {
    min-height: 500px;
}

.mv .text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    margin: auto;
}

.mv .text .title {
    font-size: 50px;
    font-weight: 600;
    line-height: 1.2;
    color: #fff;
    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    margin-bottom: 20px;
}

.mv .text .title .sub {
    display: block;
    font-size: 25px;
    margin-bottom: 20px;
}

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

    .mv .inner {
        width: calc(100% - 32px);
    }

    .mv .text {
        padding: 47px 0;
        background-size: 308px;
    }

    .mv .text .title {
        font-size: 37px;
        margin-bottom: 20px;
    }

    .mv .text .title .sub {
        font-size: 20px;
    }

}

/*pageMvSimple*/
.pageMvSimple {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: url(./img/common/bg.webp) no-repeat center;
    background-size: cover;
    padding-top: 90px;
    height: 350px;
    margin-bottom: 80px;
}

.pageMvSimple::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #0071BC;
    opacity: .9;
}

.pageMvSimple .text {
    position: relative;
}

.pageMvSimple .text .title {
    position: relative;
    display: inline-block;
    font-size: 50px;
    font-weight: 600;
    line-height: 1.2;
    color: #fff;
    padding-bottom: 20px;
}

.pageMvSimple .text .title::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    margin: auto;
    width: 50px;
    height: 1px;
    background-color: #fff;
}

.pageMvSimple .text .cm {
    color: #fff;
    margin-top: 20px;
}

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

    .pageMvSimple {
        padding-top: 60px;
        height: 280px;
    }

    .pageMvSimple .text .title {
        font-size: 40px;
    }

}

/*pageMvProducts*/
.pageMvProducts {
    position: relative;
    background: url(./img/common/bg.webp) no-repeat center;
    background-size: cover;
    padding: 170px 0 50px 0;
    margin-bottom: 80px;
}

.pageMvProducts::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #0071BC;
    opacity: .9;
}

.pageMvProducts .inner {
    position: relative;
    max-width: 1440px;
    width: 100%;
    justify-content: space-between;
    row-gap: 50px;
}

.pageMvProducts .text {
    width: 50%;
    padding-left: 20px;
}

.pageMvProducts .text .pageTitle {
    position: relative;
    display: inline-block;
    font-size: 50px;
    font-weight: 600;
    line-height: 1.2;
    color: #fff;
    padding-left: 70px;
    margin-bottom: 60px;
}

.pageMvProducts .text .pageTitle::before {
    content: "";
    position: absolute;
    top: 25px;
    left: 0;
    width: 50px;
    height: 1px;
    background-color: #fff;
}

.pageMvProducts .text .textInner {
    padding: 0 70px;
}

.pageMvProducts .text .textInner .title {
    position: relative;
    font-size: 50px;
    font-weight: 600;
    line-height: 1.2;
    color: #fff;
    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}

.pageMvProducts .text .textInner .cm {
    color: #fff;
    margin-top: 30px;
}

.pageMvProducts .text .textInner .modBtn4 {
    max-width: 280px;
    margin-top: 30px;
}

.pageMvProducts .img {
    width: 50%;
    height: 480px;
}

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

    .pageMvProducts {
        padding-top: 105px;
    }

}

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

    .pageMvProducts {
        padding-bottom: 0;
    }

    .pageMvProducts .text {
        width: 100%;
    }

    .pageMvProducts .img {
        width: 100%;
        height: 66vw;
        min-height: 250px;
    }

}

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

    .pageMvProducts {
        padding-bottom: 50px;
    }

    .pageMvProducts .text {
        text-align: center;
        padding: 0;
    }

    .pageMvProducts .text .pageTitle {
        font-size: 40px;
        padding-left: 0;
        padding-bottom: 20px;
        margin-bottom: 30px;
    }

    .pageMvProducts .text .pageTitle::before {
        top: auto;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        margin: auto;
    }

    .pageMvProducts .text .textInner {
        padding: 0;
        text-align: left;
    }

    .pageMvProducts .text .textInner .title,
    .pageMvProducts .text .textInner .cm,
    .pageMvProducts .text .textInner .modBtn4 {
        margin-left: 16px;
        margin-right: 16px;
    }

    .pageMvProducts .text .textInner .title {
        font-size: 33px;
        text-align: center;
    }

    .pageMvProducts .text .textInner .modBtn4 {
        margin-left: auto;
        margin-right: auto;
    }

    .pageMvProducts .img {
        margin-top: 30px;
    }

}

/*faqList*/
.faqInner {
    max-width: 900px;
}

.faqList dl {
    margin-bottom: 20px;
}

.faqList dl:last-child {
    margin-bottom: 0;
}

.faqList .toggleBtn {
    position: relative;
    font-family: "Josefin Sans", sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 1.2;
    padding: 25px 70px 20px 70px;
    backdrop-filter: blur(20px);
    border-radius: 80px;
    background-color: rgba(255, 255, 255, .8);
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
    cursor: pointer;
}

.faqList .toggleBtn::before,
.faqList .toggleBtn::after {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    margin: auto;
    background-color: #0071BC;
}

.faqList .toggleBtn::before {
    right: 20px;
    width: 20px;
    height: 1px;
}

.faqList .toggleBtn::after {
    right: 29px;
    height: 20px;
    width: 1px;
}

.faqList .toggleBtn.is-active::after { /* アイコン縦棒なし（開いてるとき） */
    opacity: 0;
}

.faqList .child {
    position: relative;
    padding: 30px 30px 30px 70px;
	display: none;
}

.faqList .child .flex {
    justify-content: space-between;
    row-gap: 20px;
}

.faqList .child .flex .text {
    width: calc(100% - 196px);
    margin: 0;
}

.faqList .child .flex .img {
    width: 176px;
}

.faqList .child .flex .img li {
    margin-bottom: 15px;
    text-align: center;
    list-style: none;
}

.faqList .child .flex .img li:last-child {
    margin-bottom: 0;
}

.faqList .child .flex .img li img {
    margin: 0;
}

.faqList .child .flex .img span {
    font-size: 14px;
    margin-top: 5px;
}

.faqList .textGrd {
    font-family: "Josefin Sans", sans-serif;
    position: absolute;
    font-size: 30px;
    font-weight: 600;
}

.faqList .toggleBtn .textGrd {
    top: 19px;
    left: 30px;
}

.faqList .child .textGrd {
    top: 20px;
    left: 33px;
}

.faqList .child .box {
    padding: 10px 20px;
    margin-top: 20px;
    border: 1px solid #88AAB9;
}

.faqTop .modBtn4,
.newsTop .modBtn4 {
    margin: 30px auto 0;
}

ul.tabMenu {
    display: flex;
    flex-wrap: wrap;
    column-gap: 2px;
    row-gap: 10px;
    cursor: pointer;
    margin-bottom: 50px;
}

.tabMenu li {
    text-align: center;
    padding: 0 40px 5px 40px;
    border-bottom: 2px solid #eee;
}

.tabMenu li.active {
    font-weight: bold;
    color: #0071BC;
    border-bottom: 2px solid #0071BC;
}

.tabContent {
    opacity: 0;
    height: 0;
    transition: opacity 0.3s ease, height 0s linear 0.3s;
}

.tabContent.active {
    opacity: 1;
    height: auto;
    transition: opacity 0.3s ease;
}

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

    .faqList dl {
        margin-bottom: 10px;
    }

    .faqList .toggleBtn {
        font-size: 18px;
        line-height: 1.2;
        padding: 20px 50px 14px 45px;
        border-radius: 20px;
    }

    .faqList .toggleBtn::before {
        right: 15px;
    }

    .faqList .toggleBtn::after {
        right: 24px;
    }

    .faqList .child {
        padding: 20px 20px 20px 45px;
    }

    .faqList .child .flex .text,
    .faqList .child .flex .img {
        width: 100%;
    }

    .faqList .child .flex .img li {
        margin-bottom: 20px;
        text-align: center;
    }

    .faqList .child .flex .img li:last-child {
        margin-bottom: 0;
    }

    .faqList .child .flex .img span {
        font-size: 14px;
        margin-top: 5px;
    }

    .faqList .textGrd {
        font-size: 25px;
    }

    .faqList .toggleBtn .textGrd {
        top: 15px;
        left: 10px;
    }

    .faqList .child .textGrd {
        top: 13px;
        left: 12px;
    }

    .tabMenu li {
        width: calc(100% / 3 - 2px);
        padding: 0 5px 5px 5px;
    }

}

/*whyTop*/
.whyBg {
    position: relative;
    margin-bottom: 80px;
}

.whyBg::before {
    content: "";
    position: absolute;
    top: 30px;
    left: 0;
    width: 50%;
    height: 100%;
    background-color: #F5F5F5;
}

.whyBg .whyInner {
    position: relative;
    column-gap: 40px;
    row-gap: 30px;
    justify-content: space-between;
    align-items: flex-start;
}

.whyBg .whyInner::before {
    content: "";
    position: absolute;
    top: 30px;
    left: 0;
    width: calc(100% - 30px);
    height: 100%;
    background-color: #F5F5F5;
}

.whyBgEven::before,
.whyBgEven .whyInner::before {
    left: auto;
    right: 0;
}

.whyBg .whyInner .text,
.whyBg .whyInner .img {
    position: relative;
    width: calc(50% - 20px);
}

.whyBg .whyInner .text {
    padding-top: 85px;
}

.whyBg .whyInner .text .title {
    font-family: "Josefin Sans", sans-serif;
    font-size: 30px;
    line-height: 1.2;
    margin-bottom: 10px;
}

.whyBg .whyInner .text .modBtn4 {
    margin-top: 20px;
}

.whyBg .whyInner .img {
    height: 397px;
}

.whyBg .whyInner .text p {
    margin: 0;
}

.whyTop hr {
    margin: 50px 0;
}

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

    .whyBg .whyInner .text,
    .whyBg .whyInner .img {
        width: 100%;
    }

    .whyBg .whyInner .text {
        padding-top: 0;
        padding-right: 46px;
        order: 2;
    }

    .whyBgEven .whyInner .text {
        padding-right: 0;
        padding-left: 46px;
    }

    .whyBg .whyInner .img {
        height: 65vw;
        order: 1;
    }

}

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

    .whyBg .whyInner::before {
        width: calc(100% - 16px);
    }

    .whyBg .whyInner .text {
        padding-right: 32px;
    }

}

/*programsBg*/
.programsBg {
    position: relative;
    background-image: url(./img/common/bg.webp);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.programsBg::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #0071BC;
    opacity: .9;
}

.programsList {
    position: relative;
    align-items: center;
    justify-content: space-between;
    row-gap: 30px;
    margin-bottom: 60px;
}

.programsList:last-child {
    margin-bottom: 0;
}

.programsList .left {
    position: relative;
    width: 37.5%;
    overflow: hidden;
}

.programsSwiper {
    position: relative;
    padding-bottom: 25px;
}

.programsSwiper .swiper-slide {
    max-height: 271.29px;
    height: 20.93287037037037vw;
}

.programsSwiper .swiper-pagination-bullets.swiper-pagination-horizontal {
    bottom: -6px;
}

.programsSwiper .swiper-pagination-bullet {
    background-color: #fff;
}

.programsList .text {
    width: 58.333333333%;
    text-align: center;
    color: #fff;
}

.programsList .title {
    font-family: "Josefin Sans", sans-serif;
    font-size: 40px;
    line-height: 1.2;
    padding-bottom: 15px;
    margin-bottom: 20px;
    border-bottom: 1px solid #fff;
    color: #fff;
}

.programsList p {
    margin-bottom: 0;
}

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

    .programsList .left,
    .programsList .text {
        width: 100%;
    }

    .programsList .left {
        order: 1;
    }

    .programsList .text {
        order: 2;
    }

    .programsList .title {
        font-size: 30px;
        padding-bottom: 10px;
        margin-bottom: 0;
        width: 100%;
        text-align: center;
    }

    .programsList .title.pc {
        display: none;
    }

    .programsList .title.sp {
        display: block;
    }

    .programsSwiper .swiper-slide {
        max-height: 100%;
        height: 57vw;
    }

}

/*productsTop*/
.productsTop {
    position: relative;
}

.productsTop::before {
    content: "";
    position: absolute;
    top: 0;
    right: 100%;
    width: 100%;
    height: 100%;
    background-color: #fff;
    z-index: 2;
}

.productsTop .productsSwiper {
    overflow: visible;
}

.productsTop .productsSwiper .swiper-button {
    top: -65px;
    left: auto;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    width: 60px;
    height: 60px;
}

.productsTop .productsSwiper .swiper-button-prev {
    right: 70px;
    background-image: url(./img/common/prev.svg);
}

.productsTop .productsSwiper .swiper-button-next {
    right: 0;
    background-image: url(./img/common/next.svg);
}

.productsTop .productsSwiper .swiper-slide {
    text-align: center;
}

.productsTop .productsSwiper .swiper-slide .swiper-img {
    aspect-ratio: 1;
    overflow: hidden;
}

.productsTop .productsSwiper .swiper-slide .swiper-img img {
    transition: .3s;
}

.productsTop .productsSwiper .swiper-slide .title {
    font-family: "Josefin Sans", sans-serif;
    font-size: 25px;
    line-height: 1.2;
    margin: 25px 0 10px 0;
}

.productsTop .productsSwiper .swiper-slide p {
    margin: 0;
}

/*hover*/
@media screen and (min-width: 1024px){

    .productsTop .productsSwiper a:hover .swiper-img img {
        transform: scale(1.15);
    }

    .productsTop .productsSwiper a:hover .title {
        text-decoration: underline;
    }

}

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

    .productsTop::before {
        display: none;
    }

    .productsTop .sectionTitle {
        margin-bottom: 70px;
    }

    .productsTop .productsSwiper .swiper-button {
        top: -35px;
        width: 40px;
        height: 40px;
    }

    .productsTop .productsSwiper .swiper-button-prev {
        right: min(70px,20%);
    }

    .productsTop .productsSwiper .swiper-button-next {
        right: 4%;
    }

    .productsTop .modBtn4.center {
        margin-top: 10px;
    }

}

/*productsSection1*/
.productsSection.productsSection1 .img {
    height: 52.896995708154506vw;
    max-height: 493px;
    margin-top: 40px;
}

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

    .productsSection.productsSection1 .img {
        margin-top: 30px;
    }

}

/*productsSection2*/
.productsSection2 .flex {
    align-items: flex-start;
    row-gap: 30px;
}

.productsSection2 .flex .img {
    width: 50%;
}

.productsSection2 .flex .text {
    width: 50%;
    padding-left: 40px;
}

.productsSection2 .flex .text .box {
    position: relative;
    padding: 10px 0 0 70px;
    margin-bottom: 40px;
    color: #fff;
}

.productsSection2 .flex .text .box::before {
    content: "";
    position: absolute;
    top: -5px;
    left: 0;
    width: 55px;
    height: 55px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.productsSection2 .flex .text .box:nth-child(1):before {
    background-image: url(./img/common/icon-01.png);
}

.productsSection2 .flex .text .box:nth-child(2):before {
    background-image: url(./img/common/icon-02.png);
}

.productsSection2 .flex .text .box:nth-child(3):before {
    background-image: url(./img/common/icon-03.png);
}

.productsSection2 .flex .text .box:nth-child(4):before {
    background-image: url(./img/common/icon-04.png);
}

.productsSection2 .flex .text .box:nth-child(5):before {
    background-image: url(./img/common/icon-05.png);
}

.productsSection2 .flex .text .box:last-child {
    margin-bottom: 0;
}

.productsSection2 .flex .text .box .h3 {
    color: #fff;
    margin-bottom: 10px;
}

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

    .productsSection2 .flex .img {
        width: 100%;
    }

    .productsSection2 .flex .text {
        width: 100%;
        padding-left: 0;
    }
    
    .productsSection2 .flex .text .box {
        padding: 10px 0 0 60px;
        margin-bottom: 30px;
    }

    .productsSection2 .flex .text .box::before {
        top: -5px;
        width: 50px;
        height: 50px;
    }
}

/*productsSection3*/
.productsSection3 .flex {
    margin-top: 60px;
    column-gap: 48px;
    row-gap: 40px;
}

.productsSection3 .flex .box {
    width: calc(50% - 24px);
    box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.1);
    background-color: #fff;
}

.whySection1 .flex .box {
    width: calc(100% / 3 - 32px);
}

.productsSection3 .flex .box .img {
    height: 31.759656652360512vw;
    max-height: 296px;
}

.whySection1 .flex .box .img {
    height: 19vw;
    max-height: 178px;
}

.whySection1 .flex .box .img img {
    margin: 0;
}

.productsSection3 .flex .box .text {
    padding: 30px 16px 16px 16px;
    text-align: center;
}

.productsSection3 .flex .box .text .h3 {
    margin-bottom: 15px;
}

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

    .productsSection3 .flex {
        row-gap: 30px;
        margin-top: 40px;
    }

    .productsSection3 .flex .box {
        width: 100%;
    }

    .whySection1 .flex .box {
        width: 100%;
    }

    .productsSection3 .flex .box .img {
        height: 65vw;
        max-height: 100%;
    }

}

/*productsSection4*/
.productsSection4 .box {
    padding: 30px;
    color: #fff;
    border-top: 1px solid #fff;
}

.productsSection4 .box:last-child {
    border-bottom: 1px solid #fff;
}

.productsSection4 .box .h3 {
    font-size: 20px;
    color: #fff;
    width: 200px;
    padding-right: 15px;
    margin-bottom: 0;
}

.productsSection4 .box .text {
    width: calc(100% - 200px);
    column-gap: 60px;
    row-gap: 30px;
}

.productsSection4 .box .text p {
    margin-bottom: 0;
}

.productsSection4 .box .text .checkList li {
    position: relative;
    font-family: "Josefin Sans", sans-serif;
    margin: 10px 0;
    padding: 17px 0 9px 60px;
    width: 100%;
    text-align: left;
}

.productsSection4 .box .text .checkList li::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 50px;
    height: 50px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.productsSection4 .box .text .checkList li.color-White::before {
    background-image: url(./img/products/color_bar_white02.gif);
}

.productsSection4 .box .text .checkList li.color-WhiteImage::before {
    background-image: url(./img/products/color_bar_white02.gif);
}

.productsSection4 .box .text .checkList li.color-MattSilver::before {
    background-image: url(./img/products/color_bar_matt-silver.jpg);
}

.productsSection4 .box .text .checkList li.color-GlossSilver::before {
    background-image: url(./img/products/color_bar_gloss-silver.jpg);
}

.productsSection4 .box .text .checkList li.color-Black::before {
    background-image: url(./img/products/color_bar_black.gif);
}

.productsSection4 .box .text .checkList li.color-LightBronze::before {
    background-image: url(./img/products/color_bar_bronze.gif);
}

.productsSection4 .box .text .checkList li.color-DarkBronze::before {
    background-image: url(./img/products/color_bar_dark_bronze.gif);
}

.productsSection4 .box .text .checkList li.color-ChampagneGold::before {
    background-image: url(./img/products/color_bar_champagne_gold.gif);
}

.productsSection4 .box .text .checkList li.color-Brown::before {
    background-image: url(./img/products/color_bar_brown.jpg);
}

.productsSection4 .box .text .checkList li.color-Mill-Finishpaintable::before {
    background-image: url(./img/products/color_bar_mill-finish.jpg);
}

.productsSection4 .box .text .editor {
    width: 100%;
    margin-top: -20px;
}

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

    .productsSection4 .box {
        padding: 30px 0;
    }

    .productsSection4 .box .h3 {
        width: 100%;
        margin-bottom: 20px;
        text-align: center;
    }

    .productsSection4 .box .text {
        width: 100%;
    }

}

/*productsSection5*/
.whySection1 ,
.whySection2 {
    margin-top: 50px;
}

.productsSection5 .flex {
    column-gap: 40px;
    row-gap: 70px;
}

.whySection2 .flex {
    row-gap: 40px;
    margin-top: 50px;
    margin-bottom: 50px;
    justify-content: center;
}

.productsSection5 .flex .box {
    width: calc(100% / 3 - 26.7px);
    text-align: center;
}

.productsSection5 .flex .box .icon {
    width: 80px;
    height: 80px;
    border-radius: 80px;
    background-color: #EFF3FD;
    margin: 0 auto 20px auto;
}

.productsSection5 .flex .box .icon svg {
    fill: #2851E3;
}

.productsSection5 .flex .box .icon.manual svg {
    padding: 17px 21px 0 23px;
}

.productsSection5 .flex .box .icon.drawing svg {
    padding: 21px 13px 0 20px;
}

.productsSection5 .flex .box .icon1 svg {
    padding: 26px 20px 0 20px;
}

.productsSection5 .flex .box .icon2 svg {
    padding: 22px 23px 0 23px;
}

.productsSection5 .flex .box .icon3 svg {
    padding: 22px 25px 0 25px;
}

.productsSection5 .flex .box .icon4 svg {
    padding: 22px 21px 0 21px;
}

.productsSection5 .flex .box .icon5 svg {
    padding: 23px 23px 0 23px;
}

.productsSection5 .flex .box .cm {
    margin: 20px 0 0 0;
}

.productsSection5 .flex .box a {
    text-decoration: underline;
}

.productsSection5 .flex .box a:hover {
    text-decoration: none;
}

.productsSection5 .flex .box .fileLinks {
    display: block;
}

.productsSection5 .flex .box .fileLinks a {
    display: inline-block;
}

.whySection1 .h3,
.whySection2 .h5 {
    margin-top: 0;
}

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

    .productsSection5 .flex {
        column-gap: 30px;
        row-gap: 30px;
    }

    .productsSection5 .flex .box {
        width: calc(50% - 15px);
    }

    .productsSection5 .flex .box .h3 {
        font-size: 18px;
    }

    .productsSection5 .flex .box .h3 {
        font-size: 20px;
    }

    .whySection1.productsSection5 .flex .box .cm {
        margin-top: 15px;
    }

}

/*productsSection6*/
.productsSection6 .flex {
    box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.1);
    background-color: #fff;
    min-height: 393px;
}

.productsSection6 .flex .img {
    width: 47.25%;
}

.productsSection6 .flex .text {
    width: 52.75%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 43px;
    text-align: right;
}

.productsSection6 .flex .text .title .h3 {
    font-size: 30px;
    margin: 0 0 10px 0;
    text-align: left;
}

.productsSection6 .flex .text .title .name {
    position: relative;
    padding-left: 40px;
    display: inline;
}

.productsSection6 .flex .text .title .name::before {
    content: "";
    position: absolute;
    top: 9px;
    left: 0;
    width: 30px;
    height: 1px;
    background-color: #000;
}

.productsSection6 .flex .modBtn4 {
    margin: 30px 0 0 0;
    height: auto;
}

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

    .productsSection6 .flex {
        min-height: auto;
    }

    .productsSection6 .flex .img {
        width: 100%;
    }

    .productsSection6 .flex .text {
        width: 100%;
        padding: 20px 16px;
    }

}

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

    .productsSection6 .flex .text .title .h3 {
        font-size: 20px;
    }

    .productsSection6 .flex .text .title .name {
        font-size: 14px;
    }

    .productsSection6 .flex .modBtn4 {
        margin: 30px auto 0 auto;
    }

}

/*productsSection7*/
.productsSection7 .sectionText {
    margin-bottom: 40px;
}

/*postList*/
.postList .box {
    padding: 30px 0;
    border-bottom: 1px solid #eee;
    color: inherit;
    text-decoration: none;
    transition: 0s;
}

.newsList .box {
    display: block;
}

.caseList .box {
    display: flex;
}

.postList .box:hover {
    opacity: 1;
}

.newsList .box:hover {
    color: #0a58ca;
}

.postList .box:first-child {
    padding-top: 0;
}

.caseList .box .img {
    width: calc(30% - 20px);
    overflow: hidden;
    border-radius: 10px;
    height: 186.98px;
}

.caseList .box .img img {
    transition: .2s;
}

.caseList .box:hover .img img {
    transform: scale(1.1);
}

.caseList .box .txt {
    width: 70%;
    padding-left: 20px;
}

.newsList .date {
    margin: 10px 0;
    display: block;
    font-size: 18px;
    opacity: .5;
}

.caseList .date {
    margin: 10px 0;
    display: inline-block;
    font-weight: 700;
    padding: 0 10px;
    border-radius: 50px;
    background-color: #142850;
    color: #fff;
}

.caseList .box:hover .title {
    text-decoration: underline;
}

.postList .text {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin: 0;
}

.newsList .text {
    -webkit-line-clamp: 2;
}

.caseList .text {
    -webkit-line-clamp: 3;
}

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

    .caseList .box .img {
        width: 100%;
        height: 68.41333333333334vw;
    }

    .caseList .box .txt {
        width: 100%;
        padding: 20px 0 0 0;
    }

    .newsList .text,
    .caseList .text {
        -webkit-line-clamp: 4;
    }

}

/*program*/
.programSection {
    border-radius: 0;
}

.programTop h2 {
    font-weight: 400;
    line-height: 1.5;
    margin-bottom: 50px;
}

.programSection .flex {
    row-gap: 30px;
}

.programSection .left {
    width: 50%;
    padding-right: 50px;
}

.programSection .left h2 {
    font-size: 50px;
}

.programSection .right {
    width: 50%;
}

.programSection .right .subTitle,
.programSection .right section h3,
.programSection .right section .text {
    padding-left: 35px;
}

.programSection .right .subTitle {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.programSection .right section h3 {
    position: relative;
    margin-top: 30px;
}

.programSection .right section:first-child h3 {
    margin-top: 0;
}

.programSection .right section h3::before {
    content: "";
    position: absolute;
    top: min(14px,3vw);
    left: 0;
    width: 25px;
    height: 1px;
    background-color: #0071BC;
}

.programSection .right section p {
    margin: 0;
}

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

    .programSection .left,
    .programSection .right {
        width: 100%;
    }

    .programSection .left {
        padding-right: 0;
    }

    .programSection .right .subTitle,
    .programSection .right section .text {
        padding-left: 0;
    }

    .programSection .right section:first-child h3 {
        margin-top: 30px;
    }

}

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

    .programSection .flex {
        row-gap: 20px;
    }

    .programSection .left h2 {
        font-size: 38px;
    }

}

/*gallery*/
.gallery {
    margin-bottom: 20px;
}

.gallery .gallerySwiper {
    margin-bottom: 20px;
}

.gallery .swiper-slide {
    width: 100%;
    height: 100%;
}

.gallery .gallerySwiper .swiper-slide {
    height: 30vw;
    max-height: 400px;
}

.gallery .sliderThumbnail .swiper-wrapper {
    justify-content: center;
}

.gallery .sliderThumbnail .swiper-slide {
    height: 5.5vw;
    max-height: 75px;
    cursor: pointer;
    overflow: hidden;
}

.gallery .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.gallery .sliderThumbnail .swiper-slide {
  opacity: 0.4;
  transition: opacity 0.5s ease;
}

.gallery .sliderThumbnail .swiper-slide-thumb-active {
  opacity: 1;
}

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

    .gallery .gallerySwiper .swiper-slide {
        height: 60vw;
        max-height: 100%;
    }

    .gallery .sliderThumbnail .swiper-slide {
        height: 11vw;
        max-height: 100%;
    }

}

/*form*/
.form label {
    display: block;
    font-size: 16px;
}

.form input,
.form textarea,
.form select {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    padding: 3px 10px;
    border-radius: 5px;
    background-color: #fff;
    border: none;
}

.form input::placeholder {
    color: #909090; /* 好きな色に変更 */
    opacity: 1; /* 透明度を確保 */
}
  
.form select option:first-child {
    color: #666; /* 好きな色に変更 */
}
  
.form select {
    color: #666; /* 通常の選択肢の色 */
}
  
.form select {
    background: url(./img/common/icon-bottom-blue.svg) no-repeat center right 10px;
    background-size: 10px;
    background-color: #fff;
    appearance: none;
    cursor: pointer;
}

.form textarea {
    min-height: 215px;
}

.form .wpcf7-spinner {
    display: none;    
}

.form label b {
    display: inline-block;
    margin-bottom: 5px;
}

@media screen and (min-width: 900px){

    .form .table2 tr:last-child th {
        padding-top: 30px;
    }

}

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

    .form .table2 th,
    .form .table2 td {
        display: block;
        width: 100%;
    }

    .form .table2 th {
        border-bottom: none;
        padding: 20px 0 15px 0;
    }

    .form .table2 td {
        padding: 0 0 20px 0;
    }

}

/*inquiryForm*/
.inquiryForm {
    border-radius: 30px;
    padding: 60px;
}

.inquiryForm.form label {
    display: flex;
    flex-wrap: wrap;
}

.inquiryForm.form b {
    width: 150px;
}

.inquiryForm.form .wpcf7-form-control-wrap {
    width: calc(100% - 150px);
}

.inquiryForm.form .formBtn {
    margin: 30px auto 0;
    max-width: 220px;
    text-align: center;
}

.inquiryForm.form .formBtn input[type="submit"] {
    border: 1px solid rgba(0,0,0,0);
    border-radius: 100px;
}

.inquiryForm.form .formBtn:hover input[type="submit"] {
    border: 1px solid #0071BC;
}

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

    .inquiryForm {
        border-radius: 20px;
        padding: 40px 16px;
    }

    .inquiryForm.form b {
        width: 100%;
    }

    .inquiryForm.form .wpcf7-form-control-wrap {
        width: 100%;
    }

}