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

parts-config.css for サイト名

********************************************************************************/

/*============================================================
 CSS変数 for parts共通　※サイトデザインに従い適宜設定
*============================================================*/
:root {
}

/*============================================================
 CSS変数 for parts-btn　※サイトデザインに従い適宜設定
*============================================================*/
/* 標準ボタン設定　※設定必須
---------------------------------------- */
.parts-btn {
	--width: 224px;
	--margin: 0;
	--padding: 5px 0;
	--font-size: 16px;
	--line-height: 36px;
	--border-radius: 100px;
	--border-size: 1px;
	--color: var(--common-color-text);
    --background: #fff;
    --border-color: var(--common-color-text);
    --hover-color: var(--common-color-text);
    --hover-background: var(--common-color-background1);
    --hover-border-color: var(--common-color-text);
}

/* 仮措置 */
/* .parts-btn:after {
    display: none !important;
} */

/* オプション設定　※任意
---------------------------------------- */
/* 白ボタン */
.parts-btn[data-name="white"] {
	--color: var(--common-color-text);
	--background: #fff;
	--border-color: #fff;
	--hover-color: var(--common-color-text);
	--hover-background: var(--common-color-background1);
	--hover-border-color: var(--common-color-background1);
}
/* ネイビーボタン */
.parts-btn[data-name="navy"] {
    --color: #fff;
    --background: var(--common-color-main);
    --border-color: var(--common-color-main);
    --hover-color: #fff;
    --hover-background: var(--common-color-sub);
    --hover-border-color: var(--common-color-sub);
}
/* 黒ボタン(白ボーダー) */
.parts-btn[data-name="border-white"] {
	--color: #ffffff;
	--background: #252525;
	--border-color: #ffffff;
	--hover-color: #ffffff;
	--hover-background: var(--common-color-sub);
	--hover-border-color: var(--common-color-sub);
}
/* 白ボタン(黒ボーダー) */
.parts-btn[data-name="white-border-black"] {
	--color: #252525;
	--background: #fff;
	--border-color: #252525;
	--hover-color: #252525;
	--hover-background: #f7f7f7;
	--hover-border-color: #4C4C4C;
}

/*============================================================
 CSS変数 for parts-accordions　※サイトデザインに従い適宜設定
*============================================================*/
/* 基本
---------------------------------------- */
.parts-accordions {
    --icon-size: 56px;

	--border-bottom: unset;
    --border-radius: 20px;
    --margin-bottom: 24px;
    --border-radius: 20px;
    --box-shadow: 1px 1px 16px rgba(0, 0, 0, 0.1);

	--sw-padding: 24px;
    --sw-inner-padding: calc((var(--icon-size) - var(--sw-line-height)) / 2) 40px calc((var(--icon-size) - var(--sw-line-height)) / 2) calc((var(--icon-size)) + 16px);
    --sw-font-family: var(--common-font-family);
	--sw-font-size: 20px;
	--sw-line-height: 32px;
    --sw-color: #1591EB; 
    --sw-text-align: left;
	--sw-letter-spacing: unset;
	--sw-before-width: var(--icon-size);
	--sw-before-height: var(--icon-size);
	--sw-before-background-size: var(--icon-size) auto;
	--sw-after-width: 24px;
	--sw-after-height: var(--icon-size);
	--sw-after-background-size: 24px auto;
    --content-border-margin: 24px;
    --content-border-top: solid 2px #E7E7E7;
	--content-padding: 24px;
	--content-inner-padding: 0 0 calc((var(--icon-size) - var(--content-line-height)) / 2) calc((var(--icon-size)) + 16px);
	--content-inner-padding-single: calc((var(--icon-size) - var(--content-line-height)) / 2) 0 calc((var(--icon-size) - var(--content-line-height)) / 2) calc((var(--icon-size)) + 16px);
    --content-font-size: 16px;
	--content-line-height: 26px;
	--content-before-width: var(--icon-size);
	--content-before-height: var(--icon-size);
	--content-before-background-size: var(--icon-size) auto;

    --sp-icon-size: 32px;

	--sp-sw-font-size: 16px;
	--sp-sw-line-height: 26px;
	--sp-sw-padding: 16px;

    --sp-sw-inner-padding: calc((var(--sp-icon-size) - var(--sp-sw-line-height)) / 2) 40px calc((var(--sp-icon-size) - var(--sp-sw-line-height)) / 2) calc((var(--sp-icon-size)) + 16px);
    --sp-sw-before-width: var(--sp-icon-size);
	--sp-sw-before-height: var(--sp-icon-size);
	--sp-sw-before-background-size: var(--sp-icon-size) auto;
	--sp-sw-after-height: var(--sp-icon-size);

    --sp-content-font-size: 16px;
	--sp-content-line-height: 26px;
	--sp-content-padding: 16px;

    --sp-content-inner-padding: 0 0 calc((var(--sp-icon-size) - var(--sp-content-line-height)) / 2) calc((var(--sp-icon-size)) + 16px);
	--sp-content-inner-padding-single: calc((var(--sp-icon-size) - var(--sp-content-line-height)) / 2) 0 calc((var(--sp-icon-size) - var(--sp-content-line-height)) / 2) calc((var(--sp-icon-size)) + 16px);
	--sp-content-before-width: var(--sp-icon-size);
	--sp-content-before-height: var(--sp-icon-size);
	--sp-content-before-background-size: var(--sp-icon-size) auto;
}


/*============================================================
 CSS変数 for parts-text　※サイトデザインに従い適宜設定
*============================================================*/
/* 行数制限(省略文字「...」付)
---------------------------------------- */
/* 2行　※デフォルト */
.parts-text[data-type="clamp"] {
	/* --webkit-line-clamp: 2; */
	/* --sp-webkit-line-clamp: var(--webkit-line-clamp) */
}
/* 1行 */
.parts-text[data-type="clamp-1"] {
	--webkit-line-clamp: 1;
	--sp-webkit-line-clamp: 2;
}
/* 3行 */
.parts-text[data-type="clamp-3"] {
	--webkit-line-clamp: 3;
	--sp-webkit-line-clamp: 2;
}


/*============================================================
 CSS変数 for parts-table　※サイトデザインに従い適宜設定
*============================================================*/
/* 基本
---------------------------------------- */
dl.parts-table {
	--row-border-bottom: solid 1px var(--common-color-background3);
	--row-padding: 24px 0;
	--row-gap: 0;
	--dt-width: 240px;
	--dt-font-weight: 500;
	--font-size: 16px;
	--line-height: 220%;
}


/*============================================================
 css設定　for parts-modal-content　※サイトデザインに従い適宜設定
*============================================================*/
.parts-modal-content {
	--width: 640px;
	--height: 480px;
	--padding: 32px;
	--border-radius: 24px;
	--background-color: var(--common-color-background1);

	--sp-width: 640px;
	--sp-height: var(--height);
	--sp-padding: var(--padding);
}
/* .parts-modal-content .parts-modal-header {
	padding-right: 24px;
	margin-bottom: 40px;
}
.parts-modal-content .parts-modal-header .parts-boxes {
	gap: 0 16px;
}
.parts-modal-content .parts-modal-header .name {
	width: fit-content;
	font-weight: 700;
	font-size: 24px;
	line-height: 160%;
}
.parts-modal-content .parts-modal-header .meta {
	width: fit-content;
	font-size: 12px;
	line-height: 100%;
	letter-spacing: 0.04em;
}
.parts-modal-content .parts-modal-header .meta .name-en {
	color: var(--common-color-note);
}
.parts-modal-content .parts-modal-header .meta .post {
	margin-top: 8px;
}
.parts-modal-content .parts-modal-body {
    height: calc(100% - 38px - 40px - 32px);
    overflow-y: auto;
}
.parts-modal-content .parts-modal-body .lead {
	letter-spacing: 0.04em;
	margin-bottom: 40px;
}
.parts-modal-content .parts-modal-body .parts-modal-close-btn {
	width: 224px;
	margin: 0 auto;
} */