body {
  background: #e3f0d5; }

/* -------------------------------------------------------------------------------------------------------------------------------------------------------------------------
header
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
header .logo {
  padding: 2vh 0 5vh 3vw;
  width: 45%; }
  @media (min-width: 768px) {
    header .logo {
      padding: 30px 0 60px 30px;
      width: auto; } }
@media (min-width: 768px) {
  header .wrap {
    width: 1150px; } }
header .wrap .ti_main {
  margin: 0 auto 5vh auto;
  width: 85%; }
  @media (min-width: 768px) {
    header .wrap .ti_main {
      margin: 0 auto 50px auto;
      width: auto; } }

/* -------------------------------------------------------------------------------------------------------------------------------------------------------------------------
footer
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
footer {
  background: #1e4129;
  text-align: center;
  padding: 8vh 0;
  color: #ffffff; }
  @media (min-width: 768px) {
    footer {
      padding: 80px; } }
  footer #logo {
    width: 50%;
    margin: 0 auto 3vh auto; }
    @media (min-width: 768px) {
      footer #logo {
        width: auto;
        margin: 0 auto 20px auto; } }
  footer #box {
    margin: 0 auto 3vh auto; }
    @media (min-width: 768px) {
      footer #box {
        margin: 0 auto 50px auto; } }
    footer #box .ti {
      font-size: 4.4vw;
      font-family: 'Noto Sans JP', sans-serif;
      font-weight: 500;
      margin: 0 auto 1vh auto; }
      @media (min-width: 768px) {
        footer #box .ti {
          font-size: 24px;
          margin: 0 auto 10px auto; } }
    footer #box .i_contact span {
      font-size: 4.6vw;
      font-family: 'Noto Sans JP', sans-serif;
      font-weight: 500; }
      @media (min-width: 768px) {
        footer #box .i_contact span {
          font-size: 26px; } }
  footer address {
    font-size: 2.8vw; }
    @media (min-width: 768px) {
      footer address {
        font-size: 14px; } }

/* -------------------------------------------------------------------------------------------------------------------------------------------------------------------------
pay_column
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
#pay_column {
  margin: 0 auto 10vh auto; }
  @media (min-width: 768px) {
    #pay_column {
      margin: 0 auto 100px auto; } }
  @media (min-width: 768px) {
    #pay_column .wrap {
      width: 1000px; } }
  #pay_column .wrap .lead {
    text-align: center;
    color: #1e4129;
    font-size: 0.9rem;
    line-height: 1.6rem;
    margin: 0 auto 3vh auto;
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 500; }
    @media (min-width: 768px) {
      #pay_column .wrap .lead {
        font-size: 1.8rem;
    line-height: 3.6rem;
        margin: 0 auto 100px auto; } }
  #pay_column .wrap .notice {
    text-align: center;
    margin: 0 auto 5vh auto;
    width: 90%; }
#pay_column .wrap .notice figcaption{text-align: right;font-size:0.6rem;}
    @media (min-width: 768px) {
      #pay_column .wrap .notice {
        margin: 0 auto 100px auto;
        width: auto; } 
#pay_column .wrap .notice figcaption{text-align: right;width: 700px;font-size:0.8rem;
		margin: 0 auto;}
}
  #pay_column .wrap .about {
    background: #ffffff;
    border: 2px solid #1e4129;
    border-radius: 20px;
    margin: 0 auto 5vh auto;
    padding: 3vh 6vw 5vh 6vw; }
    @media (min-width: 768px) {
      #pay_column .wrap .about {
        margin: 0 auto 100px auto;
        padding: 50px; } }
    #pay_column .wrap .about .title {
      text-align: center;
      margin: -6vh auto 2.5vh auto; }
      @media (min-width: 768px) {
        #pay_column .wrap .about .title {
          margin: -65px auto 50px auto; } }
      #pay_column .wrap .about .title span {
        background: #1e4129;
        color: #ffffff;
        padding: 1vh 3vw;
        font-size: 0.9rem;
        font-family: 'Zen Maru Gothic', serif;
        font-weight: 500;
white-space: nowrap;}
        @media (min-width: 768px) {
          #pay_column .wrap .about .title span {
            padding: 10px 50px;
            font-size: 1.8rem; } }
    #pay_column .wrap .about .img {
      text-align: center;
      margin: 0 auto 3vh auto;
      width: 90%; }
      @media (min-width: 768px) {
        #pay_column .wrap .about .img {
          margin: 0 auto 30px auto;
          width: auto; } }
    #pay_column .wrap .about p {
      color: #1e4129;
      margin: 0 auto 5vh auto;
      font-size: 0.9rem; }
      @media (min-width: 768px) {
        #pay_column .wrap .about p {
          margin: 0 auto 50px auto;
          font-size: 1.2rem; } }
    #pay_column .wrap .about .ti_app {
      background: url("../images/pay/i_tiapp_bg.png") repeat-x center center/2%;
      text-align: center;
      margin: 0 auto 3vh auto; }
      @media (min-width: 768px) {
        #pay_column .wrap .about .ti_app {
          background: url("../images/pay/i_tiapp_bg.png") repeat-x center center;
          margin: 0 auto 30px auto; } }
      #pay_column .wrap .about .ti_app span {
        background: #ffffff;
        font-family: 'Zen Maru Gothic', serif;
        color: #1e4129;
        font-weight: 500;
        padding: 1vh 1.5vw;
        font-size: 3.2vw; }
        @media (min-width: 768px) {
          #pay_column .wrap .about .ti_app span {
            padding: 10px;
            font-size: 30px; } }
    #pay_column .wrap .about .img_app {
      text-align: center; }
.app_list{
	display: flex;
	flex-wrap: wrap;
}
.app_list li{
	text-align: center;
	width: 25%;
}
.app_list li figcaption{
	font-size:0.7rem;
}
@media (min-width: 768px) {
	.app_list{
		flex-wrap: nowrap;
	}
	.app_list li{
		width: auto;
	}
}
  #pay_column .wrap .bt a {
    width: 80%;
    margin: 0 auto;
    display: block;
    text-align: center;
    color: #ffffff;
    padding: 2vh 3vw;
    background: url("../images/pay/i_bt_icon.png") no-repeat right bottom #1e4129;
    font-size: 1rem; }
    @media (min-width: 768px) {
      #pay_column .wrap .bt a {
        width: 400px;
        margin: 0 auto;
        padding: 20px;
        font-size: 1.3rem; } }