@charset "utf-8";
/* pop.css
++++++++++++++++++++++++++++++++++++++++
 NOTE
++++++++++++++++++++++++++++++++++++++++
* Charset: utf-8
* Return code: LF
++++++++++++++++++++++++++++++++++++++++
 INDEX
++++++++++++++++++++++++++++++++++++++++
* reset
* utility
* layout
* module
* tieup
++++++++++++++++++++++++++++++++++++++++ */

/* reset
++++++++++++++++++++++++++++++++++++++++ */
.pop-body,
.pop-body * {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  text-align: inherit;
  vertical-align: inherit;
  background: transparent;
}
.pop-body *,
.pop-body *::before,
.pop-body *::after {
  box-sizing: inherit;
}
.pop-body {
  box-sizing: border-box;
  padding: 4px;
  font-family: sans-serif;
  font-size: 14px;
  font-style: normal;
  line-height: 1.7;
  text-align: left;
  vertical-align: baseline;
  color: #313942;
  -webkit-text-size-adjust: 100%;
}

.pop-body a {
  text-decoration: underline;
  color: inherit;
}
.pop-body a:hover {
  text-decoration: none;
  color: #2599e3;
}
.pop-body img {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
}
.pop-body ul,
.pop-body ol {
  list-style: none;
}
.pop-body sup {
  font-size: 10px;
  vertical-align: top;
}

/* utility
++++++++++++++++++++++++++++++++++++++++ */
/* text +++++++++++++++++++ */
/* color */
.u-color-lookme { color: #ff3300 !important;}
/* weight */
.u-txt-bold { font-weight: bold !important;}
/* align */
.u-txt-left { text-align: left !important;}
.u-txt-center { text-align: center !important;}
.u-txt-right { text-align: right !important;}
@media screen and (max-width: 767px) {
  .u-txt-left-sp { text-align: left !important;}
  .u-txt-center-sp { text-align: center !important;}
  .u-txt-right-sp { text-align: right !important;}
}
@media screen and (min-width: 768px) {
  .u-txt-left-pc { text-align: left !important;}
  .u-txt-center-pc { text-align: center !important;}
  .u-txt-right-pc { text-align: right !important;}
}
/* size */
.u-txt-xs { font-size: 10px !important;}
.u-txt-sm { font-size: 12px !important;}
.u-txt-md { font-size: 14px !important;}
.u-txt-lg { font-size: 16px !important;}
.u-txt-xl { font-size: 18px !important;}
@media screen and (max-width: 767px) {
  .u-txt-xs-sp { font-size: 12px !important;}
  .u-txt-sm-sp { font-size: 13px !important;}
  .u-txt-md-sp { font-size: 14px !important;}
  .u-txt-lg-sp { font-size: 16px !important;}
  .u-txt-xl-sp { font-size: 18px !important;}
}
@media screen and (min-width: 768px) {
  .u-txt-xs-pc { font-size: 12px !important;}
  .u-txt-sm-pc { font-size: 13px !important;}
  .u-txt-md-pc { font-size: 14px !important;}
  .u-txt-lg-pc { font-size: 16px !important;}
  .u-txt-xl-pc { font-size: 18px !important;}
}

/* display +++++++++++++++++++ */
.u-display-n { display: none !important;}
.u-display-b { display: block !important;}
.u-display-i { display: inline !important;}
.u-display-ib { display: inline-block !important;}
.u-display-f { display: flex !important;}
.u-display-if { display: inline-flex !important;}
.u-display-tb { display: table !important;}
.u-display-tbc { display: table-cell !important;}
@media screen and (max-width: 767px) {
  .u-display-n-sp { display: none !important;}
  .u-display-b-sp { display: block !important;}
  .u-display-i-sp { display: inline !important;}
  .u-display-ib-sp { display: inline-block !important;}
  .u-display-f-sp { display: flex !important;}
  .u-display-if-sp { display: inline-flex !important;}
  .u-display-tb-sp { display: table !important;}
  .u-display-tbc-sp { display: table-cell !important;}
}
@media screen and (min-width: 768px) {
  .u-display-n-pc { display: none !important;}
  .u-display-b-pc { display: block !important;}
  .u-display-i-pc { display: inline !important;}
  .u-display-ib-pc { display: inline-block !important;}
  .u-display-f-pc { display: flex !important;}
  .u-display-if-pc { display: inline-flex !important;}
  .u-display-tb-pc { display: table !important;}
  .u-display-tbc-pc { display: table-cell !important;}
}

/* width +++++++++++++++++++ */
/* percent */
.u-w10p { width: 10% !important;}
.u-w20p { width: 20% !important;}
.u-w30p { width: 30% !important;}
.u-w40p { width: 40% !important;}
.u-w50p { width: 50% !important;}
.u-w60p { width: 60% !important;}
.u-w70p { width: 70% !important;}
.u-w80p { width: 80% !important;}
.u-w90p { width: 90% !important;}
.u-w100p { width: 100% !important;}
@media screen and (max-width: 767px) {
  .u-w10p-sp { width: 10% !important;}
  .u-w20p-sp { width: 20% !important;}
  .u-w30p-sp { width: 30% !important;}
  .u-w40p-sp { width: 40% !important;}
  .u-w50p-sp { width: 50% !important;}
  .u-w60p-sp { width: 60% !important;}
  .u-w70p-sp { width: 70% !important;}
  .u-w80p-sp { width: 80% !important;}
  .u-w90p-sp { width: 90% !important;}
  .u-w100p-sp { width: 100% !important;}
}
@media screen and (min-width: 768px) {
  .u-w10p-pc { width: 10% !important;}
  .u-w20p-pc { width: 20% !important;}
  .u-w30p-pc { width: 30% !important;}
  .u-w40p-pc { width: 40% !important;}
  .u-w50p-pc { width: 50% !important;}
  .u-w60p-pc { width: 60% !important;}
  .u-w70p-pc { width: 70% !important;}
  .u-w80p-pc { width: 80% !important;}
  .u-w90p-pc { width: 90% !important;}
  .u-w100p-pc { width: 100% !important;}
}

/* margin ++++++++++++++++ */
.u-mgt0 { margin-top: 0 !important;}
.u-mgt4 { margin-top: 4px !important;}
.u-mgt8 { margin-top: 8px !important;}
.u-mgt16 { margin-top: 16px !important;}
.u-mgt24 { margin-top: 24px !important;}
.u-mgt32 { margin-top: 32px !important;}
.u-mgt40 { margin-top: 40px !important;}
@media screen and (max-width: 767px) {
  .u-mgt0-sp { margin-top: 0 !important;}
  .u-mgt4-sp { margin-top: 4px !important;}
  .u-mgt8-sp { margin-top: 8px !important;}
  .u-mgt16-sp { margin-top: 16px !important;}
  .u-mgt24-sp { margin-top: 24px !important;}
  .u-mgt32-sp { margin-top: 32px !important;}
  .u-mgt40-sp { margin-top: 40px !important;}
}
@media screen and (min-width: 768px) {
  .u-mgt0-pc { margin-top: 0 !important;}
  .u-mgt4-pc { margin-top: 4px !important;}
  .u-mgt8-pc { margin-top: 8px !important;}
  .u-mgt16-pc { margin-top: 16px !important;}
  .u-mgt24-pc { margin-top: 24px !important;}
  .u-mgt32-pc { margin-top: 32px !important;}
  .u-mgt40-pc { margin-top: 40px !important;}
}

/* layout
++++++++++++++++++++++++++++++++++++++++ */
.pop-header,
.pop-main,
.pop-footer {
  max-width: 800px;
  min-width: 280x;
  margin: auto;
}

.pop-header {
  margin-bottom: 16px;
}
.pop-header .logo {
  width: 160px;
  height: 32px;
  background: url(../images/header-top-logo.svg) center/100% auto;
  white-space: nowrap;
  text-indent: 101%;
  overflow: hidden;
}
.pop-footer {
  margin-top: 16px;
}
.pop-footer small {
  display: block;
  font-size: 12px;
  text-align: center;
}

/* module
++++++++++++++++++++++++++++++++++++++++ */
/* heading ++++++++++++++++ */
.pop-ttl-01 {
  margin-bottom: 16px;
  color: #005bac;
  font-weight: normal;
  line-height: 1.2;
}
.pop-ttl-02 {
  margin-top: 24px;
  margin-bottom: 16px;
  padding-bottom: 6px;
  border-bottom: 1px solid #ccc;
  font-weight: bold;
  line-height: 1.2;
}
@media screen and (max-width: 767px) {
  .pop-ttl-01 {
    font-size: 20px;
  }
  .pop-ttl-02 {
    font-size: 16px;
  }
}
@media screen and (min-width: 768px) {
  .pop-ttl-01 {
    font-size: 32px;
  }
  .pop-ttl-02 {
    font-size: 18px;
  }
}

/* table ++++++++++++++++ */
/* table 1 */
.pop-table-01 {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 1px;
  border-top: 4px solid #c7ccd6;
  border-bottom: 4px solid #c7ccd6;
}
.pop-table-01 th,
.pop-table-01 td {
  padding: 4px 8px;
  border-bottom: 1px solid #c7ccd6;
  font-weight: normal;
  text-align: inherit;
}
.pop-table-01 tr:first-child th,
.pop-table-01 tr:first-child td {
  border-top: 1px solid #fff;
}
.pop-table-01 th:first-child,
.pop-table-01 td:first-child {
  border-left: 0;
}
.pop-table-01 th:last-child,
.pop-table-01 td:last-child {
  padding-right: 0;
}
.pop-table-01 thead {
  padding-top: 2px;
}
.pop-table-01 thead th {
  padding: 6px 12px 7px;
  border-top: 2px solid #fff;
  background-color: #f1f4f8;
  font-weight: normal;
  text-align: center;
}
.pop-table-01 th {
  background-color: #f1f4f8;
}
@media screen and (max-width: 767px) {
  .pop-table-01 .liner-rp,
  .pop-table-01 .liner-rp > tr,
  .pop-table-01 .liner-rp > th,
  .pop-table-01 .liner-rp > td,
  .pop-table-01 .liner-rp > tr > th,
  .pop-table-01 .liner-rp > tr > td {
    display: block;
  }
  .pop-table-01 .liner-rp > td,
  .pop-table-01 .liner-rp > tr > td {
    padding: 8px 0 16px;
  }
}
@media screen and (min-width: 768px) {
}

/* table 2 */
.pop-table-02 {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}
.pop-table-02 th {
  background-color: #f6f6f6;
}
.pop-table-02 tr th:nth-child(n),
.pop-table-02 tr td:nth-child(n) {
  padding: 5px;
  border: 1px solid #c7ccd6;
  text-align: inherit;
}

/* table 3 */
.pop-table-03 {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}
.pop-table-03 > tbody > tr,
.pop-table-03 > tbody,
.pop-table-03{
  display: block;
  width: 100%;
}
.pop-table-03 > tbody{
  border-top: 1px solid #c7ccd6;
  border-left: 1px solid #c7ccd6;
}
.pop-table-03 > tbody > tr{
  border-bottom: 1px solid #c7ccd6;
  border-right: 1px solid #c7ccd6;
}
.pop-table-03 > tbody > tr > td,
.pop-table-03 > tbody > tr > th{
  display: block;
}
.pop-table-03 > tbody > tr > th {
  background-color: #f6f6f6;
  border-bottom: 1px solid #c7ccd6;
}
.pop-table-03 > tbody > tr > th,
.pop-table-03 > tbody > tr > td {
  padding: 5px;
  text-align: inherit;
}
.pop-table-03 > tbody{
  flex-wrap: wrap;
}
.pop-table-03 > caption{
  white-space: nowrap;
  padding-bottom: 4px;
}
@media screen and (min-width: 768px) {
  .pop-table-03 > tbody > tr > th{
    text-align: center !important;
  }
  .pop-table-03 .border-pc{
    border-right: none !important;
  }
}


/* list ++++++++++++++++ */
.pop-list {
  padding-left: 16px;
}
.pop-list > li {
  position: relative;
  list-style: inherit;
}
.pop-list > li:not(:first-child) {
  margin-top: 4px;
}

.pop-list.disc {
  list-style: disc;
}
.pop-list.circle {
  list-style: circle;
}
.pop-list.square {
  list-style: square;
}
.pop-list.decimal {
  list-style: decimal;
}

.pop-list.notes > li::before {
  position: absolute;
  top: 0;
  left: -16px;
  display: block;
  content: '※';
}
.pop-list.prefix {
  padding-left: 1em;
}
.pop-list.prefix > li {
  text-indent: -1em;
}
.pop-list.prefix > li > .pre {
  display: inline-block;
  width: 1em;
}

.pop-list.number {
  padding-left: 32px;
  counter-reset: num;
}
.pop-list.number > li::before {
  position: absolute;
  top: 0;
  left: -32px;
  content: '(' counter(num) ')';
  counter-increment: num;
}

/* dl ++++++++++++++++ */
.pop-definitionlist .ttl {
  margin-top: 16px;
  font-weight: bold;
}
.pop-definitionlist .txt {
  margin-top: 8px;
}

/* attention box ++++++++++++++++ */
.pop-attention-box {
  padding: 10px;
  border: 1px solid #9e1d15;
  background-color: #fdf9f9;
  color: #693318;
  font-size: 12px;
  line-height: 18px;
}


/* tieup
++++++++++++++++++++++++++++++++++++++++ */
.pop-tieup {
  margin-top: 16px;
}

/* heading ++++++++++++++++ */
.pop-tieup-ttl-01,
.pop-tieup-ttl-01-latest {
  margin-bottom: 16px;
  padding: 5px 10px 3px;
  border-radius: 4px;
  background-color: #a1a4b3;
  color: #fff;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  line-height: 1.2222;
}

.latest .pop-tieup-ttl-01 {
  background-color: #005bac;
}

.pop-tieup-ttl-02 {
  margin-top: 16px;
  margin-bottom: 16px;
  padding: 5px 10px 3px;
  border: 1px solid currentColor;
  background-color: #f1f4f8;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.25;
}

/* table ++++++++++++++++ */
.pop-tieup-table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  border-top: 1px dotted #c7ccd6;
}
.pop-tieup-table th,
.pop-tieup-table td {
  padding-top: 4px;
  padding-bottom: 4px;
  border-bottom: 1px dotted #c7ccd6;
  font-weight: normal;
  text-align: inherit;
}
.pop-tieup-table th {
  color: #005bac;
  font-weight: bold;
}
@media screen and (max-width: 767px) {
  .pop-tieup-table .liner-rp,
  .pop-tieup-table .liner-rp > tr,
  .pop-tieup-table .liner-rp > th,
  .pop-tieup-table .liner-rp > td,
  .pop-tieup-table .liner-rp > tr > th,
  .pop-tieup-table .liner-rp > tr > td {
    display: block;
  }
  .pop-tieup-table .liner-rp > th,
  .pop-tieup-table .liner-rp > tr > th {
    border-bottom: 0;
  }
  .pop-tieup-table .liner-rp > td,
  .pop-tieup-table .liner-rp > tr > td {
    padding-top: 0;
  }
}
@media screen and (min-width: 768px) {
  .pop-tieup-table td {
    padding-left: 8px;
  }
}
