@import url(https://fonts.googleapis.com/css?family=Noto+Sans:400,700,900&display=swap);
@import url(https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,700,900&display=swap&subset=japanese);

html.ja
{
   font-family: "メイリオ", Meiryo, "Hiragino Sans", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "ＭＳ Ｐゴシック", Arial, Verdana, sans-serif, "FFXIV_Lodestone_SSF"
}

html.en-us,
html.en-gb,
html.fr,
html.de
{
   font-family: Arial, Verdana, sans-serif, "メイリオ", Meiryo, "Hiragino Sans", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "FFXIV_Lodestone_SSF"
}

.util ul li a {padding: 0;}
input.input_txt
{
   border: solid 1px #666;
   padding: 2px
}

.button
{
   display: block;
   cursor: pointer;
   font-size: 1px;
   background-position: 0 0
}

.button:hover
{
   background-position: 0 bottom
}

.button_unbind,
.button_unbind *
{
   filter: alpha(opacity=30);
   -moz-opacity: 0.3;
   opacity: 0.3;
   cursor: default
}

.button_unbind:hover
{
   background-position: 0 0 !important
}

.buttonclick
{
   display: block;
   font-size: 1px;
   background-position: 0 top
}

.buttonclick:hover
{
   background-position: 0 center
}

.buttonclick:active
{
   background-position: 0 bottom
}

.hide
{
   display: none
}

.transparent
{
   filter: alpha(opacity=0);
   -moz-opacity: 0;
   opacity: 0
}

.invisible
{
   visibility: hidden
}

.highlight
{
   font-weight: bold
}

.absolute
{
   position: absolute
}

.relative
{
   position: relative
}

.cursor-default
{
   cursor: default
}

.cursor-pointer
{
   cursor: pointer
}

.cursor-move
{
   cursor: move
}

#header_area
{
   width: 100%;
   background: #000;
   height: 37px;
   border-bottom: solid 1px #000000;
   line-height: 1;
   z-index: 2
}

#header_area .inner
{
   padding: 0 12px;
   margin: 0 auto
}

#header_area .logo
{
   float: left;
   width: 120px;
   padding-top: 12px
}


@media screen and (max-width: 767px)
{
   #header_area
   {
      width: 100%;
      background: #000;
      height: 38px;
      border-bottom: solid 1px #000000;
      line-height: 1;
      z-index: 2;
      line-height: 1;
      padding: 10px 12px 12px 12px;
      -moz-box-sizing: border-box;
      -webkit-box-sizing: border-box;
      box-sizing: border-box
   }

   #header_area .inner
   {
      padding: 0 0;
      margin: 0 auto
   }

   #header_area .logo
   {
      float: left;
      width: 135px;
      padding-top: 0
   }

   #header_area .logo img
   {
      width: 135px;
      height: auto
   }

}

img[loading="lazy"]
{
   opacity: 0;
   transition: opacity 0.4s
}

html:has(.fancybox-active)
{
   overflow: hidden
}

.fancybox-active
{
   margin-right: 0 !important
}

.fancybox-bg
{
   opacity: 1 !important
}

a
{
   -webkit-tap-highlight-color: transparent !important;
   outline: none !important
}

.txt_red
{
   color: #cc2929 !important
}

#winning
{
   padding-bottom: 80px;
   position: relative
}

#winning:after
{
   content: "";
   display: block;
   position: fixed;
   top: 0;
   left: 0;
   z-index: -1;
   width: 100%;
   height: 100vh;
   background: url(../images/license/license_bg.jpg) center top no-repeat #efeeea;
   -moz-background-size: 100% auto;
   -o-background-size: 100% auto;
   -webkit-background-size: 100% auto;
   background-size: 100% auto
}

#license
{
   padding-bottom: 64px;
   position: relative;
    font-family: 'Noto Sans', sans-serif
}

.ja #license
{
  font-family: 'Noto Sans JP', sans-serif
}

#license:after
{
   content: "";
   display: block;
   position: fixed;
   top: 0;
   left: 0;
   z-index: -1;
   width: 100%;
   height: 100vh;
   background: url(../images/license/license_bg.jpg) center top no-repeat #efeeea;
   -moz-background-size: 100% auto;
   -o-background-size: 100% auto;
   -webkit-background-size: 100% auto;
   background-size: 100% auto
}

#transmission
{
   padding-bottom: 64px;
   position: relative;
   font-family: 'Noto Sans', sans-serif
}

.ja #transmission
{
   font-family: 'Noto Sans JP', sans-serif
}

#transmission:after
{
   content: "";
   display: block;
   position: fixed;
   top: 0;
   left: 0;
   z-index: -1;
   width: 100%;
   height: 100vh;
   background: url(../images/license/license_bg.jpg) center top no-repeat #efeeea;
   -moz-background-size: 100% auto;
   -o-background-size: 100% auto;
   -webkit-background-size: 100% auto;
   background-size: 100% auto
}

#content_inner
{
   max-width: 992px;
   position: relative;
   margin: 0 auto;
   padding-top: 2.01613%
}

#content_header
{
   text-align: center;
   max-width: 100%;
   padding: .24% 0% 2.41% 0%;
   margin-right: auto;
   margin-left: auto;
   position: relative
}

#content_header img
{
   width: 64.51%;
   max-width: 640px;
   min-width: 272px;
   height: auto
}

.winning__header__text
{
   margin-bottom: 32px;
   text-align: center
}

.winning__header__text img
{
   width: auto;
   max-width: 100%;
   height: auto;
   max-height: 56px
}

.winning__content
{
   margin: 0 24px
}

.winning__list
{
   padding-bottom: 16px
}

.winning__list__box
{
   padding: 0 12px;
   margin-bottom: 16px;
   border-bottom: 1px solid #cccccc;
   height: 1%
}

.winning__list__box p
{
   margin-bottom: 16px;
   height: 1%
}

.winning__list__box:nth-last-child(1)
{
   border-bottom: 0;
   margin-bottom: 0
}

.winning__list__box__left
{
   width: 49%;
   float: left
}

.winning__list__box__image
{
   width: 49%;
   float: right;
   padding-bottom: 16px
}

.winning__list__box__image img
{
   width: 100%;
   max-width: 413px;
   height: auto
}

.winning__list__title
{
   display: block;
   margin-bottom: 12px;
   color: #9a872e;
   font-size: 16px;
   line-height: 1.2
}

.winning__list__text
{
   display: block;
   font-size: 14px;
   color: #4c4c4c
}

.winning__list__text a
{
   color: #4774cc;
   text-decoration: none
}

.winning__list__text a:hover
{
   color: #5990ff;
   text-decoration: underline
}

.winning__btn_area
{
   width: auto;
   max-width: 388px;
   margin: 0 auto
}

.winning__btn_area__wrapper
{
   margin: 32px 40px 16px
}

.winning__bt_free_trial
{
   display: inline-block;
   padding: 0 2px;
   width: 50%;
   max-width: 190px;
   padding-top: 31.57895%;
   position: relative;
   -moz-box-sizing: border-box;
   -webkit-box-sizing: border-box;
   box-sizing: border-box
}

.winning__bt_free_trial img
{
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: auto;
   display: block
}

.winning__bt_free_trial img.on
{
   opacity: 0
}

.winning__bt_buy_now
{
   display: inline-block;
   padding: 0 2px;
   width: 50%;
   max-width: 190px;
   padding-top: 31.57895%;
   position: relative;
   -moz-box-sizing: border-box;
   -webkit-box-sizing: border-box;
   box-sizing: border-box
}

.winning__bt_buy_now img
{
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: auto;
   display: block
}

.winning__bt_buy_now img.on
{
   opacity: 0
}

.winning__bt_ldst
{
   width: 100%;
   max-width: 392px;
   height: auto;
   margin-left: auto;
   margin-right: auto;
   bottom: 0;
   right: 0
}

.winning__bt_ldst a
{
   display: block;
   position: relative
}

.winning__bt_ldst a img
{
   width: 100%;
   min-width: 112px
}

.winning__bt_ldst a img.on
{
   position: absolute;
   top: 0;
   left: 0;
   opacity: 0
}

.license-title
{
   max-width: 992px;
   margin: 0 auto 10px;
   padding: 4px 8px;
   text-align: center;
   font-size: 16px;
   font-weight: bold;
   box-sizing: border-box;
   color: #fff;
   background-color: #293c66;
   -webkit-border-radius: 32px;
   border-radius: 32px
}

.license-layout
{
   position: relative;
   background: #ffffff;
   height: 1%;
   padding: 20px 40px 40px;
   -webkit-border-radius: 6px;
   border-radius: 6px;
   box-shadow: 0 3px 3px rgba(0, 0, 0, 0.3);
   color: #404040
}

.license-page
{
   font-size: 14px;
   line-height: 1.5
}

.license-page.selected
{
   display: block
}

.license-page a
{
   color: #2556b8
}

.license-page p
{
   font-size: 14px
}

.license-page .parts__text
{
   margin-bottom: 16px
}

.license-page__inner
{
   white-space: pre-wrap;
   font-size: 14px;
   line-height: 1.5
}

.license__cap,
.license__cap_launcher
{
   padding: 20px;
   margin-bottom: 40px;
   border-radius: 6px;
   -webkit-box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.1) inset;
   box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.1) inset;
   text-align: center;
   font-size: 14px
}

.license__cap_launcher
{
   text-align: left
}

.btn__menu-3
{
   display: table;
   width: 100%;
   margin-bottom: 20px
}

.btn__menu-3 li
{
   float: left;
   width:100%;
   /* width: calc(100% / 3); */
   vertical-align: top
}

.btn__menu-3 li:nth-child(1) a
{
   -moz-border-radius-topleft: 6px;
   -webkit-border-top-left-radius: 6px;
   border-top-left-radius: 6px;
   -moz-border-radius-bottomleft: 6px;
   -webkit-border-bottom-left-radius: 6px;
   border-bottom-left-radius: 6px;
   -moz-border-radius-topright: 6px;
   -webkit-border-top-right-radius: 6px;
   border-top-right-radius: 6px;
   -moz-border-radius-bottomright: 6px;
   -webkit-border-bottom-right-radius: 6px;
   border-bottom-right-radius: 6px;cursor: default; 
}

.btn__menu-3 li:nth-child(3) a
{
   -moz-border-radius-topright: 6px;
   -webkit-border-top-right-radius: 6px;
   border-top-right-radius: 6px;
   -moz-border-radius-bottomright: 6px;
   -webkit-border-bottom-right-radius: 6px;
   border-bottom-right-radius: 6px
}

.btn__menu-3 a
{
   display: flex;
   justify-content: center;
   align-items: center;
   width: 100%;
   height: 40px;
   padding: 0 8px;
   box-sizing: border-box;
   background-color: #eee;
   line-height: 1.2;
   font-size: 14px;
   color: #404040;
   -webkit-box-shadow: 0px 1px 0px 0px rgba(255, 255, 255, 0.25) inset, 0px -1px 0px 0px rgba(0, 0, 0, 0.1) inset, 1px 0px 0px 0px rgba(255, 255, 255, 0.25) inset, -1px 0px 0px 0px rgba(0, 0, 0, 0.1) inset;
   box-shadow: 0px 1px 0px 0px rgba(255, 255, 255, 0.25) inset, 0px -1px 0px 0px rgba(0, 0, 0, 0.1) inset, 1px 0px 0px 0px rgba(255, 255, 255, 0.25) inset, -1px 0px 0px 0px rgba(0, 0, 0, 0.1) inset
}

.btn__menu-3 a:hover
{
   text-decoration: none;
   background-color: #fff
}

.btn__menu-3 .btn__menu--active
{
   background-color: #4769b3;
   -webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1) inset;
   box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1) inset;
   color: #fff
}

.btn__menu-3 .btn__menu--active:hover
{
   background-color: #4769b3
}

.transmission-title
{
   max-width: 992px;
   margin: 0 auto 10px;
   padding: 4px 8px;
   text-align: center;
   font-size: 16px;
   font-weight: bold;
   box-sizing: border-box;
   color: #fff;
   background-color: #293c66;
   -webkit-border-radius: 32px;
   border-radius: 32px
}

.transmission-text
{
   margin-bottom: 40px;
   font-size: 14px;
   font-weight: 400;
   line-height: 1.5
}

.transmission-layout
{
   position: relative;
   background: #ffffff;
   height: 1%;
   padding: 20px 40px 40px;
   -webkit-border-radius: 6px;
   border-radius: 6px;
   box-shadow: 0 3px 3px rgba(0, 0, 0, 0.3);
   color: #404040
}

.transmission-layout .icon__button
{
   cursor: pointer;
   color: #6f6f6f;
   transform: scale(1);
   transition: transform 0.3s
}

.transmission-layout .icon__button:hover
{
   transform: scale(1.3)
}

.transmission-layout .service__table
{
   width: 100%;
   border-collapse: collapse
}

.transmission-layout .service__table thead th
{
   background: #e5e5e5;
   padding: 10px;
   font-size: 14px;
   font-weight: 700
}

.transmission-layout .service__table thead th:nth-of-type(4)
{
   width: 11%
}

.transmission-layout .service__table thead th:nth-of-type(5),
.transmission-layout .service__table thead th:nth-of-type(6),
.transmission-layout .service__table thead th:nth-of-type(7)
{
   width: 12%
}

.transmission-layout .service__table tbody td
{
   background: #fafafa;
   padding: 10px;
   font-size: 14px;
   font-weight: 400;
   border-bottom: solid 2px #d7d7d7
}

.transmission-layout .service__table tbody td.no__border
{
   border-bottom: none
}

.transmission-layout .service__table tbody td.text__center
{
   text-align: center
}

.transmission-layout .service__table tbody td img
{
   height: 20px;
   width: auto;
   margin: 0 auto
}

.transmission-layout .service__table tbody td .service_names
{
   font-size: 14px;
   font-weight: 400
}

.transmission-layout .classification
{
   display: block;
   padding: 10px;
   color: #fff;
   font-size: 14px;
   font-weight: 700;
   line-height: 1;
   text-align: center;
   border-radius: 100px
}

.transmission-layout .classification.performance
{
   background: #4c7ee8
}

.transmission-layout .classification.targeting
{
   background: #e52e6b
}

.transmission-layout .modal
{
   opacity: 0;
   position: fixed;
   z-index: 1;
   left: 0;
   top: 0;
   height: 100vh;
   width: 100%;
   transition: opacity 0.3s;
   z-index: -1;
   display: flex;
   justify-content: center;
   align-items: center
}

.transmission-layout .modal.open
{
   opacity: 1;
   z-index: 999
}

.transmission-layout .modal__content
{
   background-color: #ffffff;
   width: 50%;
   box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.2), 0 7px 20px 0 rgba(0, 0, 0, 0.17);
   padding: 50px;
   position: relative;
   text-align: left
}

.transmission-layout .modal__close
{
   cursor: pointer;
   position: absolute;
   right: 20px;
   top: 20px
}

.transmission-layout .modal__title
{
   padding-bottom: 10px;
   border-bottom: solid 2px #f3f3f3
}

.transmission-layout .modal__company__names
{
   padding-right: 20px;
   font-size: 14px;
   font-weight: 900
}

.transmission-layout .modal__service_names
{
   font-size: 14px;
   font-weight: 900
}

.transmission-layout .modal__sub__title
{
   margin-top: 30px;
   margin-bottom: 10px;
   font-size: 14px;
   font-weight: 900
}

.transmission-layout .modal__in__content
{
   min-height: 100px;
   padding: 10px;
   border: solid 2px #c2c2c2;
   background: #f2f2f2;
   border-radius: 5px
}

.transmission-layout .modal__in__content p
{
   font-size: 14px;
   font-weight: 400
}

@media screen and (max-width: 767px)
{

   .winning__header__title--en-us,
   .winning__header__title--en-gb
   {
      font-size: 14px
   }

   .winning__header__title--fr
   {
      font-size: 16px
   }

   .winning__header__title--de
   {
      font-size: 12px
   }

   .winning__list__box__left
   {
      width: auto;
      float: none
   }

   .winning__list__box__image
   {
      width: 100%;
      float: none;
      text-align: center
   }

   .winning__list__box__image img
   {
      width: 100%;
      max-width: 431px;
      height: auto
   }

   #license
   {
      padding-bottom: 40px
   }

   .license-title
   {
      -webkit-border-radius: 0;
      border-radius: 0
   }

   .license-layout
   {
      padding: 20px 16px 20px
   }

   .license__cap
   {
      padding: 10px;
      margin-bottom: 20px;
      border-radius: 4px
   }

   .btn__menu-3 li:nth-child(1) a
   {
      -moz-border-radius-topleft: 4px;
      -webkit-border-top-left-radius: 4px;
      border-top-left-radius: 4px;
      -moz-border-radius-bottomleft: 4px;
      -webkit-border-bottom-left-radius: 4px;
      border-bottom-left-radius: 4px
   }

   .btn__menu-3 li:nth-child(3) a
   {
      -moz-border-radius-topright: 4px;
      -webkit-border-top-right-radius: 4px;
      border-top-right-radius: 4px;
      -moz-border-radius-bottomright: 4px;
      -webkit-border-bottom-right-radius: 4px;
      border-bottom-right-radius: 4px
   }

   #transmission
   {
      padding-bottom: 40px
   }

   .transmission-title
   {
      -webkit-border-radius: 0;
      border-radius: 0
   }

   .transmission-text
   {
      margin-bottom: 20px
   }

   .transmission-layout
   {
      padding: 20px 16px 20px
   }

   .transmission-layout .service__list .list__item
   {
      border-radius: 5px;
      border: solid 2px #c2c2c2;
      background: #f2f2f2;
      padding: 20px;
      margin-bottom: 30px
   }

   .transmission-layout .service__list .list__item:last-of-type
   {
      margin-bottom: 0
   }

   .transmission-layout .service__list__table
   {
      overflow: hidden
   }

   .transmission-layout .service__list__table dt,
   .transmission-layout .service__list__table dd
   {
      float: left;
      margin-bottom: 30px;
      font-size: 14px
   }

   .transmission-layout .service__list__table dt
   {
      clear: both;
      width: 100px;
      font-weight: 700
   }

   .transmission-layout .service__list__table dt:first-of-type
   {
      padding: 6px 0
   }

   .transmission-layout .service__list__table dd
   {
      width: calc(100% - 100px);
      font-weight: 400
   }

   .transmission-layout .service__list__table dd .classification
   {
      display: inline-block
   }

   .transmission-layout .service__list__table dd p,
   .transmission-layout .service__list__table dd span
   {
      font-size: 14px
   }

   .transmission-layout .service__link__list
   {
      display: flex;
      justify-content: center
   }

   .transmission-layout .service__link__list a
   {
      padding: 0px 1vw;
      color: #2556b8;
      font-size: 14px
   }

   .transmission-layout .service__link__list a:hover
   {
      color: #2556b8
   }
}