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

/*********************************************************************
*
* Copyright (c) CUBIC DESIGN INC.
*
* Url : http://www.cubicdesign.co.jp
*
* Built       : 2017/09/12
* Last update : 2018/12/11
* Made by     : Murata Hiroyuki
* Updated by  : Murata Hiroyuki
*
**********************************************************************/


/*************************************************************************************************************************
* 画面幅：680px 以下
*************************************************************************************************************************/


/* privacy policy */
section{ padding: 30px 15px 0;}
section:not(:first-of-type){ margin-top: 30px; border-top: 1px solid #ddd;}
section h3{ margin: 0 0 20px; font: 300 19px/1.5 "heisei-kaku-gothic-std",sans-serif; color: #333; text-align: center;}
section p{ line-height: 1.8;}
section > div > dl{ margin: 20px 0 0 0;}
section > div > dl > dt{ margin: 15px 0 5px; font-weight: bold;}
section > div > dl > dt:first-of-type{ margin-top: 0;}
section > div > dl.type01 > dt::before{ content: "■";}
section > div > dl.type02{ counter-reset: number;}
section > div > dl.type02 > dt::before{ counter-increment: number; content: "("counter(number)")";}
section > div > dl > dt.right{ font-weight: normal; text-align: right;}
section > div > dl > dt.right::before{ content: "";}
section > div > dl > dd{ line-height: 1.5;}
section > div > dl > dd.right{ font-weight: normal; text-align: right;}
section > div > dl > dd ul{ margin: 5px 0 0;}
section > div > dl > dd ul li{ padding: 0 0 0 1em; text-indent: -1em;}
section > div > dl > dd ul li:before{ content:"・"}
section > div > dl > dd > ol{ counter-reset: number; list-style: none; margin: 5px 0 0; padding: 0;}
section > div > dl > dd > ol > li{ list-style-type: none; padding: 5px 0 0 1em; text-indent: -1em;}
section > div > dl > dd > ol > li:before{ counter-increment: number; content: counter(number)".";}
section > div > dl > dd ol li ul li{ padding: 0 0 0 1em; text-indent: -1em;}
section > div > dl > dd ol li ul li:before{ content:"・"}
section > div > dl > dd a{ margin: 0 3px; color: #333; text-decoration: underline; word-break: break-all;}
section > div > dl > dd table{ width: 100%; margin: 8px 0 0 0; border-top: 1px solid #ddd; border-left: 1px solid #ddd; text-indent: 0;}
section > div > dl > dd li table{ width: calc(100% + 1em); margin-left: -1em;}
section > div > dl > dd table th,
section > div > dl > dd table td{ padding: 10px; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd;}
section > div > dl > dd table thead th{ background: #f1f1f1; text-align: center;}
section > div > dl > dd table tbody th{ width: 130px;}
section > div > dl > dd table .brPC{ display: none;}
section > div > dl > dd p{ margin: 5px 0 0;}
section > div > dl > dd table.contact{ margin: 5px 0 0;}
section > div > dl > dd table.contact tbody th{ width: 110px; text-align: center;}
section > div > dl > dd table.contact tbody td{ text-align: left;}
section > div > dl > dd table.contact tbody td dl{ margin: 10px 0 0;}
section > div > dl > dd table.contact tbody td dl dt{ margin: 5px 0 0;}
section > div > dl > dd table.contact tbody td dl dt::before{ content: "●"}

.p-mark{ margin: 10px 0 0;}
.p-mark dt{ margin: 0 0 5px; font-weight: bold;}
.p-mark dd .logo{ display: block; width: 100px; margin: 15px auto;}

.consulation > dt{ margin: 0 0 5px; font-weight: bold;}
.consulation > dd .logo{ display: block; width: 100px; margin: 15px auto;}

.consulation dl{ margin: 0 0 15px;}
.consulation dl dt::before{content: "【";}
.consulation dl dt::after{content: "】";}
.consulation dl dt a{ text-align: none;}



/*************************************************************************************************************************
* 画面幅：681px 以上
*************************************************************************************************************************/
@media print, screen and (min-width:681px){
  
  /* privacy policy */
  section{ width: 980px; margin: 0 auto; padding: 65px 0 0;}
  section:not(:first-of-type){ margin-top: 65px;}
  section h3{ margin-bottom: 30px; font-size: 27px;}
  section > div > dl{ margin-top: 30px;}
  section > div > dl > dt{ margin-top: 30px;}
  section > div > dl > dt.right{ margin-top: 30px;}
  section > div > dl > dd table .brPC{ display: block;}
  section > div > dl > dd table .brSP{ display: none;}
  section > div > dl > dd table th,
  section > div > dl > dd table td{ padding: 15px;}
  section > div > dl > dd table tbody th{ width: 180px;}
  section > div > dl > dd table.contact tbody th{ width: 150px;}
  section > div > dl > dd table.contact tbody td{ text-align: left;}
  section > div > dl > dd table.contact tbody td dl::after{ display: block; content: ""; height: 0; visibility: hidden; clear: both;}
  section > div > dl > dd table.contact tbody td dl dt{ width: 80px; float: left;}
  section > div > dl > dd table.contact tbody td dl dt::before{ content: ""}
  section > div > dl > dd table.contact tbody td dl dd{ width: calc(100% - 80px); margin: 5px 0 0; float: left;}
  section > div > dl > dd table.contact tbody td dl dd::before{ content: "："}
  
  .p-mark dd{ display: flex;}
  .p-mark dd .logo{ margin: -25px 0 0 10px;}
  
  .consulation{ margin: -30px 0 0;}
  .consulation dl{ display: flex; flex-wrap: wrap;}
  .consulation dl dt{ width: 4em;}
  .consulation dl dt::before{content: "";}
  .consulation dl dt::after{content: "";}
  .consulation dl dd{ width: calc(100% - 5rem);}
  .consulation dl dd::before{content: "：";}
  .consulation dl dd .brSP{ display: none;}
  
}