@charset "utf-8";
/* ===================================================
	privacy CSS
====================================================== */

#privacy { background-color: #f9f8f6;}

/* ---------------------------------------------------
#main
------------------------------------------------------ */
#privacy h1 { padding: 160px 0 0; text-align: center;}
#privacy h1 span.tit { margin: 0 0 20px; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(45deg,#faa51e,#ff7e00); font-size: 20px; font-family: 'Noto Sans JP', sans-serif; font-weight: 600; line-height: 1;}

/* IE対応 */
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
  #privacy h1 span.tit { background: none; color: #ff7e00;}
}

#privacy h1 > span { display: block; margin: 20px 0 35px; font-size: 40px; font-family: 'Noto Sans JP', sans-serif; font-weight: 500;}
#privacy section { width: 1100px; margin: 0 auto 100px;}
#privacy section h2 { padding: 0 0 30px; font-size: 24px; color: #ff7c00;}
#privacy section li,
#privacy section div,
#privacy section p,
#privacy section pre,
#privacy section span { word-break: break-word;}
#privacy section p + p,
#privacy section ul + p { margin: 10px 0 0;}
#privacy section .info { padding: 20px 40px; margin: 20px 0; border: 1px solid #e5e4e2; box-sizing: border-box;}
#privacy section [class*="list_"] { counter-reset: num;}
#privacy section [class*="list_"] > li,
#privacy section [class*="list_"] > dt { display: flex; counter-increment: num;}
#privacy section [class*="list_"] > li::before,
#privacy section [class*="list_"] > dt::before { flex-shrink: 0;}
#privacy section [class*="list_"] > li > div,
#privacy section [class*="list_"] > li > p,
#privacy section [class*="list_"] > dt > span { flex-grow: 1;}
#privacy section .list_num > li { padding: 20px 0; border-bottom: 1px solid #e5e4e2;}
#privacy section .list_num > li::before { content: counter(num)'.'; margin: 0 10px 0 0; color: #ff7c00; font-size: 20px;}
#privacy section .list_num > li > div,
#privacy section .list_num > li > p { margin: 5px 0 0;}
#privacy section .list_dot > li::before { content: '・';}
#privacy section .list_num_inner { margin: 5px 0 0;}
#privacy section .list_num_inner > dt::before { content: counter(num)')'; margin: 0 5px 0 0;}
#privacy section .list_num_inner > dd { margin: 0 0 0 1.5em;}
#privacy section .list_dot_inner > li::before { content: '-'; margin: 0 5px 0 0;}
#privacy section .list_kana > li::before { content: counter(num, katakana)')'; margin: 0 5px 0 0;}
#privacy section .list_alpha > li::before { content: counter(num, lower-alpha)')'; margin: 0 5px 0 0;}
#privacy section a { text-decoration: underline;}
#privacy section a:hover { text-decoration: none;}

#privacy #sec1 .date { margin: 0 0 30px;}
#privacy #sec1 .p_mark { display: flex; align-items: center; justify-content: space-between;}
#privacy #sec1 .p_mark p { width: calc(100% - 200px);}
#privacy #sec1 .p_mark a { flex-shrink: 0; display: inline-block; width: 170px; background: #fff; padding: 25px; box-sizing: border-box;}
#privacy #sec1 .sign { margin: 20px 0 25px; text-align: right;}
#privacy #sec1 .sign .br_sp { display: none;}

#privacy #sec2 h3 { margin: 25px 0 0; font-size: 20px; font-weight: normal;}

#privacy #contents_wrap #breadcrumb { clear: both;}


@media screen and (max-width: 1100px) {
  #privacy section { width: 94%;}
  #privacy #contents_wrap #breadcrumb { width: 100%;}
}

@media screen and (max-width: 600px) {
#privacy h1 { width: 94%; margin: 0 auto; padding: 100px 0 0;}
#privacy h1 span.tit { font-size: 25px;}
#privacy h1 > span { font-size: 30px;}
#privacy section { width: 94%; margin-bottom: 60px;}
#privacy section .info { display: block; padding: 15px 20px;}
#privacy section .list_num > li::before { margin-right: 5px;}

#privacy #sec1 .p_mark { display: block; text-align: center;}
#privacy #sec1 .p_mark p { width: auto; margin: 0 0 15px; text-align: left;}
#privacy #sec1 .sign { margin: 10px 0 15px;}
#privacy #sec1 .sign .br_sp { display: inline;}
}


/* ===================================================
	function_rules CSS
====================================================== */

#function_rules { background-color: #f9f8f6;}

/* ---------------------------------------------------
#main
------------------------------------------------------ */
#function_rules h1 { padding: 160px 0 0; text-align: center;}
#function_rules h1 span.tit { margin: 0 0 15px; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(45deg,#faa51e,#ff7e00); font-size: 25px; font-family: 'Noto Sans JP', sans-serif; font-weight: 600; line-height: 1;}

/* IE対応 */
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
  #function_rules h1 span.tit { background: none; color: #ff7e00;}
}

#function_rules h1 > span { display: block; margin: 20px 0 35px; font-size: 40px; font-family: 'Noto Sans JP', sans-serif; font-weight: 500;}
#function_rules section { width: 1100px; margin: 0 auto;}
#function_rules section div { padding: 35px 0; border-top: 1px solid #e2d7c8; line-height: 1.8;}
#function_rules .terms_list>p { padding: 0 0 30px;}
#function_rules h2 { padding: 0 0 15px; font-size: 20px; color: #ff7c00; font-weight: bold;}
#function_rules .terms_list div ul { padding: 20px 0;}
#function_rules .terms_list div ol { padding-left: 10px;}
#function_rules .terms_list div ol > li { padding-left: 1.5em; list-style: none; counter-increment: number; position: relative;}
#function_rules .terms_list div ol > li:not(:first-of-type) { padding-top: 10px;}
#function_rules .terms_list div ul > li { padding-left: 1.5em; counter-increment: number_sub; position: relative;}
#function_rules .terms_list div ol > li:before { content: counter(number) "."; position: absolute; top: 10px; left: 0;}
#function_rules .terms_list div ol > li:first-of-type:before { top: 0;}
#function_rules .terms_list div ul > li:before { content: "(" counter(number_sub) ")"; position: absolute; top: 0; left: 0;}
#function_rules .terms_list div dl { padding: 10px 0 0; counter-increment: list;}
#function_rules .terms_list div dt { padding: 0 0 0 1.5em; font-weight: bold; position: relative;}
#function_rules .terms_list div dt::before { content: counter(list) "."; position: absolute; top: 0; left: 0;}
#function_rules .terms_list div dd { padding-left: 1.5em;}
#function_rules .terms_list > ul { border-top: 1px solid #e2d7c8;}
#function_rules .terms_list > ul li { padding: 20px 0 0;}
#function_rules section > dl { display: table; width: 100%; margin: 80px 0 40px; border: 1px solid #e5e4e2;}
#function_rules section > dl > dt,#function_rules section > dl > dd { display: table-cell; vertical-align: middle;}
#function_rules section > dl > dt { width: 300px; text-align: center; font-size: 18px; font-weight: bold; background-color: #f2f2f2;}
#function_rules section > dl > dd dl { display: table; width: 100%; border-bottom: 1px solid #e5e4e2; background-color: #fff;}
#function_rules section > dl > dd dl dt,#function_rules section > dl > dd dl dd { display: table-cell; padding: 10px 25px;}
#function_rules section > dl > dd dl dt { width: 320px; border-right: 1px solid #e5e4e2; background-color: #f8f8f8;}
#function_rules section > dl > dd dl:nth-last-of-type(1) { border-bottom: none;}

#function_rules section div.detail { border: none; padding: 0; line-height: inherit;}
#function_rules section div.detail h4 { padding: 0 0 5px; font-size: 18px; font-weight: bold;}
#function_rules section div.detail div { display: flex; align-items: center; border: 1px solid #e5e4e2; padding: 0; line-height: inherit;}
#function_rules section div.detail div dt { font-weight: bold;}
#function_rules section div.detail div > dl { display: table; width: 50%; min-height: 296px; padding: 0; box-sizing: border-box;}
#function_rules section div.detail div > dl:nth-of-type(1) { border-right: 1px solid #e5e4e2;}
#function_rules section div.detail div > dl > dt,
#function_rules section div.detail div > dl > dd { display: table-cell; padding: 20px; box-sizing: border-box;}
#function_rules section div.detail div > dl > dt { width: 250px; border-right: 1px solid #e5e4e2; background-color: #f2f2f2; vertical-align: middle; }
#function_rules section div.detail div > dl > dd { background-color: #fff;}
#function_rules section div.detail div > dl > dd dl { padding: 0;}
#function_rules section div.detail div > dl > dd ul { padding: 0 0 20px;}
#function_rules section div.detail div > dl > dd ul li { padding-left: 1em; text-indent: -1em;}
#function_rules section div.detail div > dl > dd ul li::before { content: "・";}
#function_rules section div.detail >ul { padding: 10px 0 100px;}
#function_rules section div.detail >ul li { padding-left: 1em; text-indent: -1em;}
#function_rules section div.detail >ul li::before { content: "※";}

@media screen and (max-width: 1100px) {
  #function_rules section { width: 94%;}
}

@media screen and (max-width: 600px) {
#function_rules h1 { width: 94%; margin: 0 auto; padding: 100px 0 0;}
#function_rules h1 > span { font-size: 30px;}
#function_rules section div { padding: 20px 0;}
#function_rules .terms_list div dt { padding: 0 0 0 1.2em;}
#function_rules .terms_list div dd { padding-left: 1.2em;}
#function_rules .terms_list div ol { padding-left: 0;}
#function_rules .terms_list div ol > li { padding-left: 1.2em;}
#function_rules section > dl,#function_rules section > dl >dt,#function_rules section > dl >dd { display: block;}
#function_rules section > dl > dt { width: 100%; padding: 20px 0;}
#function_rules section > dl > dd dl,#function_rules section > dl > dd dl dt,#function_rules section > dl > dd dl dd { display: block;}
#function_rules section > dl > dd dl dt,#function_rules section > dl > dd dl dd { width: 100%; padding: 10px; box-sizing: border-box;}
#function_rules section > dl > dd dl dt { border-right: none;}

#function_rules section div.detail div { display: block; }
#function_rules section div.detail div > dl,
#function_rules section div.detail div > dl > dt, #function_rules section div.detail div > dl > dd { display: block;}
#function_rules section div.detail div > dl { min-height: auto; width: 100%;}
#function_rules section div.detail div > dl:nth-of-type(1) { border-right: none;}
#function_rules section div.detail div > dl > dt { border-right: none; width: auto; padding: 10px 20px;}
#function_rules section div.detail div > dl > dd { padding-bottom: 0;}
}


/* ===================================================
	privacy CSS
====================================================== */

#error { background-color: #f9f8f6;}

/* ---------------------------------------------------
#main
------------------------------------------------------ */
#error h1 { padding: 160px 0 0; text-align: center;}
#error h1 span.tit { margin: 0 0 20px; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(45deg,#faa51e,#ff7e00); font-size: 28px; font-family: 'Noto Sans JP', sans-serif; font-weight: 600; line-height: 1;}

/* IE対応 */
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
  #error h1 span.tit { background: none; color: #ff7e00;}
}

#error h1 > span { display: block; margin: 20px 0 35px; font-size: 26px; font-family: 'Noto Sans JP', sans-serif; font-weight: 500;}
#error #contents_wrap div { width: 1100px; margin: 100px auto 200px;}
#error #contents_wrap div h2+p { padding: 0 0 20px;}


@media screen and (max-width: 1100px) {
  #error #contents_wrap div { width: 94%;}
  #error #contents_wrap #breadcrumb { width: 100%;}
}

@media screen and (max-width: 600px) {
#error h1 { width: 94%; margin: 0 auto; padding: 100px 0 0;}
#error h1 span.tit { font-size: 20px;}
#error h1 > span { font-size: 24px;}
#error #contents_wrap div { width: 94%; margin: 50px auto 100px;}
}


