@charset "utf-8";

/* -----------------------------------
*     Common
* ------------------------------------ */

::selection {
  background: #03a9f4;
  color: #ffffff;
}

::-moz-selection {
  background: #03a9f4;
  color: #ffffff;
}

html {
  height: 100%;
  margin: 0;
  padding: 0;
  position: relative;
  min-height: 100%;
}

body {
  height: 100%;
  margin: 0;
  padding: 0;
  background: #ffffff;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", "Osaka", sans-serif;
}

.topsection {
  padding: 50px 0;
}

.sectionblock {
  padding: 25px 0;
}

.sectiontitle {
  font-size: 2rem;
  margin-bottom: 2rem;
  font-weight: bold;
  letter-spacing: -2px;
  display: inline-block;
  border-bottom: 4px solid #0066ad;
  font-family: "Open Sans", sans-serif;
}

.fonten01 {
  font-family: "Montserrat", sans-serif;
}

.fonten02 {
  font-family: "DM Serif Text", serif;
}

img[src$=".svg"] {
  width: 100%;
}

a:link {
  transition: all 0.3s ease-out;
  -webkit-transition: all 0.3s ease-out;
}

a:hover {
  opacity: 0.8;
  filter: alpha(opacity=80);
}

.clickbox {
  cursor: pointer;
}

.animate {
  visibility: hidden;
}

.btn.btn-readmore {
  padding: 0.8rem 1rem;
  color: #ffffff;
  font-size: 0.8rem;
  font-weight: bold;
  border: 2px solid #ffffff;
  border-radius: 0;
  font-family: "Open Sans", sans-serif;
}

.btn.btn-readmore:hover {
  color: #0066ad;
  background: #ffffff;
  border: 2px solid #ffffff;
  opacity: 1;
  filter: alpha(opacity=100);
}

/* ----------------------
	no-gutters
---------------------- */

.no-gutters {
  margin-right: 0;
  margin-left: 0;
}

.no-gutters > .col,
.no-gutters > [class*="col-"] {
  padding-right: 0;
  padding-left: 0;
}

/* -----------------------------------
*     animation
* ------------------------------------ */

/* ----------------------
     LeftToRight
---------------------- */

@-webkit-keyframes LeftToRight {
  from {
    width: 100%;
    height: 100%;
  }
  to {
    width: 0;
    height: 100%;
  }
}

@keyframes LeftToRight {
  from {
    width: 100%;
    height: 100%;
  }
  to {
    width: 0;
    height: 100%;
  }
}

.LeftToRight {
  -webkit-animation-name: LeftToRight;
  animation-name: LeftToRight;
  animation-direction: normal;
  animation-fill-mode: both;
}

/* ----------------------
     fadeinUpMini
---------------------- */

@-webkit-keyframes fadeInUpMini {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 10%, 0);
    transform: translate3d(0, 10%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInUpMini {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 10%, 0);
    transform: translate3d(0, 10%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInUpMini {
  -webkit-animation-name: fadeInUpMini;
  animation-name: fadeInUpMini;
}

/* ----------------------
     BottomToTop
---------------------- */

@-webkit-keyframes BottomToTop {
  0% {
    animation-delay: 1s;
    opacity: 0;
    transform: translateY(100px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes BottomToTop {
  0% {
    animation-delay: 1s;
    opacity: 0;
    transform: translateY(100px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ----------------------
     TextFadeIn
---------------------- */

.TextFadeIn {
  opacity: 0;
  animation-name: TextFadeIn;
  animation-fill-mode: forwards;
}
@keyframes TextFadeIn {
  0% {
    opacity: 0;
    transform: translateX(-50px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

/* ----------------------
     anibox
---------------------- */

.anibox {
  width: 100%;
  position: relative;
}

.anibox .whitelayer {
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 1);
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1200;
  animation-timing-function: cubic-bezier(0, 0.34, 0.02, 0.98);
}

.anibox .blacklayer {
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 1);
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1200;
  animation-timing-function: cubic-bezier(0, 0.34, 0.02, 0.98);
}

/* -----------------------------------
*     header
* ------------------------------------ */

#header {
  height: 75px;
  background: rgba(1, 99, 177, 0.9);
}

#header.transparent {
  background: transparent;
  transition: all 0.3s ease-out;
  -webkit-transition: all 0.3s ease-out;
}

#headerlogo {
  width: 105px;
  margin: 0;
  text-align: center;
}

#headerlogo .logo {
  width: 100%;
  height: auto;
  transition: all 0.3s ease-out;
  -webkit-transition: all 0.3s ease-out;
}

#headerlogo a {
  display: block;
}

.yonextennis {
  font-size: 0.6rem;
  color: #ffffff;
}

.yonextennis:hover {
  color: #ffffff;
  text-decoration: none;
}

.navbar-toggler-icon {
  width: 2.5em;
  height: 2.5em;
}

#header .navbar {
  padding: 0;
}

#header .navbar-collapse {
  height: 100vh;
  padding: 0;
  background: rgba(0, 98, 177, 0.95);
  position: relative;
  z-index: 1000;
  top: -96px;
  overflow-y: scroll;
}

#headermenu.navbar-nav {
  height: 100vh;
  margin-bottom: 10rem;
}

.navbar-light .navbar-toggler {
  position: absolute;
  top: 10px;
  right: 0;
  border: none;
  z-index: 1001;
}

#headermenu .nav-item .sub-nav-link.disabled {
  color: #9e9e9e;
}

#headermenu li.nav-item {
  text-align: center;
  font-weight: bold;
  border-bottom: 1px solid #5193c8;
  font-family: "Open Sans", sans-serif;
}

#headermenu.navbar-nav .nav-link {
  padding: 1.5rem 0;
  color: #ffffff;
  display: block;
  font-size: 1.2rem;
  line-height: 1rem;
}

#headermenu.navbar-nav .nav-link span {
  color: #9e9e9e;
  font-size: 0.6rem;
}

#headermenu.navbar-nav .sub-nav-link {
  padding: 0.5rem 0;
  color: #ffffff;
  display: block;
  font-size: 0.8rem;
  line-height: 1rem;
}

#headermenu.navbar-nav .sub-nav-link span {
  font-size: 0.6rem;
}

#headermenu li.nav-item a::after {
  font-size: 0.6em;
  display: block;
  text-align: center;
}

#headermenu li.snsicon img {
  width: 40px;
}

#header-cover.active {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 97;
  background: rgba(0, 0, 0, 0.66);
  transition: all 0.3s ease-out;
  -webkit-transition: all 0.3s ease-out;
}

.spyonexlink a {
  color: #ffffff;
}

/* -----------------------------------
*     footer
* ------------------------------------ */

#footer {
  background: rgba(0, 102, 173, 0.9);
  position: relative;
  z-index: 10;
  color: #ffffff;
}

#footerlogo {
  width: 200px;
  margin: 0 auto 30px auto;
}

#footermenu li {
  border-bottom: 1px solid #5193c8;
  font-family: "Open Sans", sans-serif;
}

#footermenu li a {
  font-size: 1rem;
  display: block;
  color: #ffffff;
}

#footer .snsicon img {
  width: 40px;
}

p#copyright {
  margin-bottom: 0;
  padding: 1rem 0;
  color: #ffffff;
}

/* ----------------------
*     page-top
* ---------------------- */

#page-top {
  position: fixed;
  bottom: 20px;
  right: 20px;
  font-size: 50%;
  z-index: 3000;
  display: none;
}

#page-top a {
  background: #4ea1db;
  text-decoration: none;
  color: #fff;
  width: 60px;
  height: 60px;
  padding: 17px;
  text-align: center;
  display: block;
}

#page-top a:hover {
  text-decoration: none;
  background: #03254c;
}

#page-top a img {
  width: 100%;
}

/* -----------------------------------
*     top
* ------------------------------------ */

/* ---------------------
*     slider
* ---------------------- */

.sliderbox {
  position: relative;
  max-width: 100%;
  height: 100vh;
  margin: auto;
  overflow: hidden;
  position: relative;
}

.sliderbox .bgImg {
  opacity: 0;
  width: 100%;
  height: 100vh;
  z-index: 10;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  position: absolute;
  left: 0;
  top: 0;
  -webkit-animation: anime 15s 0s infinite;
  animation: anime 15s 0s infinite;
}

.sliderbox .src1 {
  background-image: url(../img/top/mainimg_sp01.jpg);
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
}
.sliderbox .src2 {
  background-image: url(../img/top/mainimg_sp02.jpg);
  -webkit-animation-delay: 5s;
  animation-delay: 5s;
}
.sliderbox .src3 {
  background-image: url(../img/top/mainimg_sp03.jpg);
  -webkit-animation-delay: 10s;
  animation-delay: 10s;
}
@keyframes anime {
  0% {
    opacity: 0;
  }
  17% {
    opacity: 1;
  }
  33% {
    opacity: 1;
  }
  50% {
    opacity: 0;
    transform: scale(1.05);
    z-index: 9;
  }
  100% {
    opacity: 0;
  }
}

.bg-slider__title {
  position: absolute;
  bottom: 20%;
  right: 10%;
  width: 150px;
  z-index: 100;
  transition: all 0.9s cubic-bezier(0.59, 0.02, 1, -0.09);
  animation: BottomToTop 0.3s;
  animation-fill-mode: both;
  animation-delay: 1s;
}

.sliderbox.anibox .whitelayer {
  animation-timing-function: cubic-bezier(0.59, 0.02, 1, -0.09);
}

/* ----------------------
*     sponsorbnr
* ---------------------- */

#sponsorbnr {
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  background: rgba(255, 255, 255, 0.5);
  z-index: 20;
  transition: all 0.9s cubic-bezier(0.59, 0.02, 1, -0.09);
  animation: BottomToTop 0.3s;
  animation-fill-mode: both;
  animation-delay: 1.2s;
}

.sb-zero .sponsorbnrbox {
  width: 300px;
}

.sb-first .sponsorbnrbox {
  width: 200px;
}

.sb-first .sponsorbnrbox:nth-child(2) {
  width: 110px;
}

.sb-first .sponsorbnrbox:nth-child(3) {
  width: 160px;
}

/* ----------------------
*     topnews
* ---------------------- */

#topnewstitlebox {
  width: 100%;
  background: #0066ad;
  position: relative;
}

#topnewstitlebox .sectiontitle {
  margin-bottom: 0;
  padding-top: 0.1rem;
  font-size: 1.5rem;
  text-align: center;
  color: #ffffff;
}

#topnewstitlebox .btn.btn-readmore {
  padding: 0.4rem 0.8rem;
  position: absolute;
  right: 10px;
  bottom: 8px;
  font-size: 0.7rem;
}

#topnewscontents {
  width: 100%;
  background: #f2f8ff;
}

#topnews iframe {
  width: 100%;
  height: 220px;
  border: none;
  overflow-y: hidden;
}

#topnewslist li a {
  color: #000000;
}

#topnewslist li a:hover {
  color: #000000;
  text-decoration: underline;
}

/* ----------------------
*     topgs
* ---------------------- */

#gstitlebox {
  position: relative;
  background: #000000;
}

#gstitlebox .btn.btn-readmore {
  position: absolute;
  top: 42%;
  right: 10%;
  color: #0066ad;
  border: 2px solid #0066ad;
}

.topgsbox {
  height: 160px;
  position: relative;
  overflow: hidden;
}

.topgsbox .anibox {
  position: static;
}

.topgsbox a .darklayer {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  position: absolute;
  z-index: 10;
  transition: all 0.2s ease-out;
  -webkit-transition: all 0.2s ease-out;
}

.topgsbox a:hover .darklayer {
  background: rgba(0, 0, 0, 0.2);
  transition: all 0.2s ease-out;
  -webkit-transition: all 0.2s ease-out;
}

.topgsbox img {
  position: absolute;
  left: 0;
  top: -50px;
}

.topgsbox .txtbox .title {
  width: 100%;
  margin: 0 auto;
  position: absolute;
  bottom: 15%;
  font-size: 1.3rem;
  font-weight: bold;
  color: #ffffff;
  z-index: 11;
}

.topgsbox .txtbox .subtitle {
  font-size: 0.7rem;
}

#gstitlebox .btn.btn-readmore:hover {
  color: #ffffff;
  background: #0066ad;
  border: 2px solid #0066ad;
}

/* ----------------------
*     coming soon
* ---------------------- */

.topgsbox.comingsoon .darklayer {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  position: absolute;
  z-index: 10;
}

.topgsbox.comingsoon .txtbox .cstxt {
  width: 100%;
  margin: 0 auto;
  position: absolute;
  bottom: 55%;
  font-size: 1.2rem;
  font-weight: bold;
  font-style: italic;
  color: #ffffff;
  background: rgba(0, 102, 173, 0.7);
  z-index: 11;
}

.topgsbox.comingsoon .txtbox .title {
  color: #b4b4b4;
}

/* ----------------------
*     tophisotry
* ---------------------- */

#tophistory {
  padding: 3rem 0;
  background: url("../img/top/historyimg_sp.jpg") no-repeat top left;
  background-size: cover;
}

#tophistory .sectiontitle {
  color: #ffffff;
  border-bottom: 4px solid #ffffff;
}

#tophistory .blocktxt {
  font-size: 1rem;
  color: #ffffff;
}

/* ----------------------
*     topmedia
* ---------------------- */

#topmedia {
  padding: 3rem 0;
  background: #f2f8ff;
}

#topmediatitle {
  position: relative;
}

#topmedia .sectiontitle {
  color: #0066ad;
}

#topmedia .btn.btn-readmore {
  color: #0066ad;
  border: 2px solid #0066ad;
}

#topmedia .btn.btn-readmore:hover {
  background: #0066ad;
  color: #ffffff;
  border: 2px solid #0066ad;
}

#topmediatitle .btn.btn-readmore {
  position: absolute;
  top: 16%;
  right: 0;
}

#topmediatitle .btn.btn-readmore:hover {
  background: #0066ad;
  color: #ffffff;
  border: 2px solid #0066ad;
}

#topmedia .blocktxt {
  font-size: 1.2rem;
}

#topmedia iframe {
  width: 100%;
  height: 230px;
  border: none;
  overflow-y: hidden;
}

/* ----------------------
*     topsns
* ---------------------- */

#topsns {
  margin-top: 5rem;
  padding: 3rem 0;
  background: #f2f8ff;
}

#topsns .sectiontitle {
  color: #0066ad;
}

#topsns #snstitle {
  position: relative;
  top: -4rem;
}

#topsns .snsicon img {
  width: 40px;
}

/* -----------------------------------
*     page
* ------------------------------------ */

#pageheader {
  width: 100%;
  height: 300px;
  position: relative;
}

#pageheadermsg {
  position: absolute;
  left: 2rem;
  bottom: 1rem;
  font-size: 1.6rem;
  font-weight: bold;
  color: #ffffff;
  font-family: "Open Sans", sans-serif;
}

#pagetitle {
  font-size: 1.8rem;
  font-weight: bold;
  color: #0063b9;
  text-align: center;
}

/* -----------------------------------
*     news
* ------------------------------------ */

#news #pageheader {
  background: url(../img/news/pageheaderimg_sp.jpg);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
}

#newsblock {
  background: #f2f8ff;
}

/* ----------------------
*     pagenavi
* ---------------------- */

.wp-pagenavi a,
.wp-pagenavi span {
  padding: 5px 12px;
}

.wp-pagenavi span {
  background: #ffffff;
  color: #0063b9;
  border: 1px solid #0063b9;
}

.wp-pagenavi a {
  background: #0063b9;
  color: #ffffff;
  border: 1px solid #0063b9;
}

.wp-pagenavi a:hover {
  text-decoration: none;
}

.wp-pagenavi a:hover,
.wp-pagenavi span.current {
  border: 1px solid #0063b9;
}

/* -----------------------------------
*     Go for the GRAND SLAM
* ------------------------------------ */

#gftgs #pageheader {
  background: url(../img/go-for-the-grand-slam/pageheaderimg_sp.jpg);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
}

#gftgsblock {
  background: #000000;
}

#gftgsmsg {
  font-size: 0.6rem;
  color: #ffffff;
}

/* ----------------------
*     gftgspv
* ---------------------- */

#gftgspv:before {
  height: 6rem;
  content: "";
  display: block;
}

#gftgspv h2 {
  font-size: 1rem;
  font-weight: bold;
  color: #ffffff;
}

/* ----------------------
*     gftgsmenubox
* ---------------------- */

.gftgsmenubox {
  width: 100%;
  position: relative;
}

.gftgsmenubox .txtbox {
  width: 300px;
  height: 140px;
  margin: -70px 0 0 -150px;
  position: absolute;
  z-index: 10;
  top: 50%;
  left: 50%;
  color: #ffffff;
}

.gftgsmenubox .txtbox .title {
  font-size: 1.4rem;
  font-weight: bold;
}

.gftgsmenubox .txtbox .subtitle {
  font-size: 0.6rem;
}

.gftgsmenubox .txtbox .txt {
  font-size: 0.8rem;
}

.gftgsmenubox .txtbox .btn.btn-readmore {
  padding: 0.6rem 1rem;
}

/* ----------------------
*     coming soon
* ---------------------- */

.gftgsmenubox.comingsoon .txtbox .cstxt {
  width: 150px;
  background: #0066ad;
  color: #ffffff;
}

/* -----------------------------------
*     Junior Training Camps
* ------------------------------------ */

#gftgs_jtc #pageheader {
  background: url(../img/go-for-the-grand-slam/junior-training-camps/pageheaderimg_sp.jpg);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
}

#yonexjuniorprogram {
  background: #f2f8ff;
}

#yonexjuniorprogram .sectiontitle {
  color: #424242;
  border-bottom: none;
}

#yonexjuniorprogram .txt br {
  display: none;
}

#yonexjuniorprogram .txt p {
  font-size: 0.9rem;
}

/* ----------------------
*     coach
* ---------------------- */

#coach .sectiontitle {
  color: #0063b9;
}

.coachbox {
  width: 50%;
  position: relative;
}

.coachbox .txtbox {
  width: 100%;
  position: absolute;
  top: 60%;
  z-index: 10;
}

.coachbox .txtbox .title {
  font-size: 1rem;
  font-weight: bold;
  color: #ffffff;
}

.advisorystaff {
  background: #3ca55c;
  background: -webkit-linear-gradient(to left, #b5ac49, #3ca55c);
  background: linear-gradient(to left, #b5ac49, #3ca55c);
  color: #ffffff;
  font-size: 0.6rem;
  font-weight: bold;
}

/* ----------------------
*     player
* ---------------------- */

#player .sectiontitle {
  color: #0063b9;
}

.playerbox {
  width: 50%;
  position: relative;
}

.playerbox .txtbox {
  width: 100%;
  position: absolute;
  top: 60%;
  z-index: 10;
}

.playerbox .txtbox .title {
  font-size: 1rem;
  font-weight: bold;
  color: #ffffff;
}

/* ----------------------
*     camp report
* ---------------------- */

#campreport {
  padding: 5rem 0;
  background: #f2f8ff;
}

#campreporttitle {
  position: relative;
}

#campreport .sectiontitle {
  color: #0066ad;
}

.campreportbox {
  width: 100%;
  max-width: 360px;
}

#campreport .campreportbox a {
  color: #212529;
}

#campreport .btn.btn-readmore {
  color: #0066ad;
  border: 2px solid #0066ad;
}

#campreporttitle .btn.btn-readmore {
  position: absolute;
  top: 16%;
  right: 0;
}

#campreport .blocktxt {
  font-size: 1.2rem;
}

#campreport .campreportbox p {
  font-size: 1rem;
}

.owl-nav [class*="owl-"] {
  width: 40px;
  height: 40px;
  color: #ffffff !important;
  background: #0066ad !important;
}

/* ----------------------
*     summary
* ---------------------- */

#campsummary {
  background: #0163b1;
}

#campsummaryimg {
  height: 200px;
  background-image: url(../img/go-for-the-grand-slam/junior-training-camps/campsummaryimg.jpg);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
}

#campsummary .sectiontitle {
  color: #ffffff;
  border-bottom: 4px solid #ffffff;
}

#campsummary .sectiontitle span {
  font-size: 1.3rem;
}

#campsummarybody {
  background: #f2f8ff;
}

#campsummarybody dl dt {
  font-size: 1.4rem;
  color: #0163b1;
}

#campsummarybody .table td {
  width: 50%;
}

#campsummary .btn.btn-readmore {
  padding: 1.5rem;
  display: inline-block;
  color: #ffffff;
  background: #0066ad;
  font-size: 1.1rem;
  font-weight: bold;
  border: 2px solid #0066ad;
  border-radius: 0;
}

#campsummary .btn.btn-readmore:hover {
  background: #ffffff;
  color: #0066ad;
  border: 2px solid #0066ad;
}

/* ----------------------
*     profile
* ---------------------- */

#profile {
  margin-top: 3rem;
}

.profilemodal .modal-header {
  border-bottom: none;
}

.profilemodal .modal-header .close {
  font-size: 3rem;
}

.profilemodal .modal-body {
  padding: 0;
}

.profilemodal .modal-body {
  background: #ffffff url(../img/go-for-the-grand-slam/junior-training-camps/profilemainbg.png) no-repeat top right;
}

#profilesummary #pagetitle {
  color: #484848;
}

#profilesummary #pagetitle span {
  font-size: 0.9rem;
}

#profilesummary dl {
  margin-bottom: 0;
  color: #484848;
  line-height: 1.2;
  font-size: 0.9rem;
}

#profilesummary .advisorystaff {
  position: static;
}

#profilecareer {
  background: rgba(3, 94, 186, 0.8);
}

#profilecareer .sectiontitle {
  font-size: 1.8rem;
  font-weight: bold;
  color: #ffffff;
  border: none;
}

#careersummary.txtbox .txt {
  color: #d4d4d4;
}

#careersummary.txtbox .txt .title {
  display: inline-block;
  background: #125aa7;
  font-weight: bold;
}

#profiledescription p {
  font-size: 1rem;
}

.lookforward {
  z-index: 1000 !important;
}

.lookforward-close-btn {
  top: auto !important;
  left: auto !important;
  bottom: 0 !important;
}

.lookforward-close-btn._pattern1 {
  display: none;
}

/* ----------------------
*     past_activity
* ---------------------- */
#past_activity .sectiontitle {
  color: #0063b9;
}

#past_activity .btn.btn-readmore {
  padding: 1.5rem;
  display: inline-block;
  color: #0066ad;
  font-size: 1.1rem;
  font-weight: bold;
  border: 2px solid #0066ad;
  border-radius: 0;
}

#past_activity .btn.btn-readmore:hover {
  background: #0066ad;
  color: #ffffff;
  border: 2px solid #0066ad;
}

#past_activity .btn.btn-readmore[aria-expanded="false"]::after {
  content: "keyboard_arrow_right";
  font-family: "Material Icons";
  float: right;
}

#past_activity .btn.btn-readmore[aria-expanded="true"]::after {
  content: "keyboard_arrow_down";
  font-family: "Material Icons";
  float: right;
}

/* -----------------------------------
*     Overseas Expedition
* ------------------------------------ */

#gftgs_oe #pageheader {
  background: url(../img/go-for-the-grand-slam/overseas-expedition/pageheaderimg.jpg);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* ----------------------
*     expedition report
* ---------------------- */

#expeditionreport {
  padding: 5rem 0;
  background: #f2f8ff;
}

#expeditionreporttitle {
  position: relative;
}

#expeditionreport .sectiontitle {
  color: #0066ad;
}

#expeditionreport .btn.btn-readmore {
  color: #0066ad;
  border: 2px solid #0066ad;
}

#expeditionreporttitle .btn.btn-readmore {
  position: absolute;
  top: 16%;
  right: 0;
}

#expeditionreport .blocktxt {
  font-size: 1.2rem;
}

#expeditionreport iframe {
  width: 100%;
  height: 150px;
  border: none;
  overflow: hidden;
}

/* -----------------------------------
*     Expedition report
* ------------------------------------ */

#expedition_reportblock {
  background: #f2f8ff;
}

/* -----------------------------------
*     Tournaments Overseas
* ------------------------------------ */

#t-overseas #pageheader {
  background: url(../img/t-overseas/pageheaderimg_sp.jpg);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
}

#t-overseas .sectiontitle {
  color: #0066ad;
}

#t-overseas .instagram {
  padding: 2rem 0;
}

#t-overseas .instagram .instagramicon {
  width: 60px;
}

#t-overseas .instagram .txt {
  font-size: 1rem;
}

#t-overseas .instagram .followbtn {
  display: block;
  font-size: 0.9rem;
  background-color: #0066ad;
  color: #fff;
  text-decoration: none;
  border-radius: 6px;
}

#t-overseas .instagram .followbtn:hover {
  color: #fff;
  text-decoration: none;
}

#t-overseas .instagram .followbtn .icon {
  width: 25px;
}

/* -----------------------------------
*     ITF
* ------------------------------------ */

#gftgs_itf #pageheader {
  background: url(../img/itf_ehime/pageheaderimg_sp.jpg);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
}

#ijlogo {
  width: 200px;
}

#ijlogolong {
  width: 100%;
}

/* ----------------------
*     itf_area
* ---------------------- */
.itfbox {
  height: 160px;
  position: relative;
  overflow: hidden;
}

.itfbox .anibox {
  position: static;
}

.itfbox a .darklayer {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  position: absolute;
  z-index: 10;
  transition: all 0.2s ease-out;
  -webkit-transition: all 0.2s ease-out;
}

.itfbox a:hover .darklayer {
  background: rgba(0, 0, 0, 0.2);
  transition: all 0.2s ease-out;
  -webkit-transition: all 0.2s ease-out;
}

.itfbox img {
  position: absolute;
  left: 0;
  top: -50px;
}

.itfbox .txtbox .title {
  width: 100%;
  margin: 0 auto;
  position: absolute;
  bottom: 15%;
  font-size: 1.3rem;
  font-weight: bold;
  color: #ffffff;
  z-index: 11;
}

.itfbox .txtbox .subtitle {
  font-size: 0.7rem;
}

.itfbox .itrtourlogo {
  width: 150px;
  height: 100px;
  margin: -50px 0 0 -75px;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1000;
}

/* ----------------------
*     coming soon
* ---------------------- */

.itfbox.comingsoon .darklayer {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  position: absolute;
  z-index: 10;
}

.itfbox.comingsoon .txtbox .cstxt {
  width: 100%;
  margin: 0 auto;
  position: absolute;
  bottom: 44%;
  font-size: 1.2rem;
  font-weight: bold;
  font-style: italic;
  color: #ffffff;
  background: rgba(0, 102, 173, 0.7);
  z-index: 11;
}

.itfbox.comingsoon .txtbox .title {
  color: #b4b4b4;
}

/* ----------------------
*     taikai
* ---------------------- */

#taikai {
  background: #f2f8ff;
}

#taikaititle {
  position: relative;
}

#taikai .sectiontitle {
  color: #0063b9;
}

#taikaibody {
  background: #f2f8ff;
}

#taikai table {
  font-size: 0.8rem;
}

#taikai table th {
  width: 35%;
  text-align: center;
}

#taikai table td {
  width: 65%;
}

#taikai .scheduletitle {
  font-size: 1.5rem;
  color: #0063b9;
  font-weight: bold;
}

#taikai table#taikaischedule th {
  text-align: right;
  font-weight: normal;
}

#taikai .btn.btn-readmore {
  padding: 1.5rem;
  display: inline-block;
  color: #0066ad;
  font-size: 1.1rem;
  font-weight: bold;
  border: 2px solid #0066ad;
  border-radius: 0;
}

#taikai .btn.btn-readmore:hover {
  background: #0066ad;
  color: #ffffff;
  border: 2px solid #0066ad;
}

#taikaiimg {
  height: 200px;
  background-image: url(../img/itf_ehime/kaisaiimg.jpg);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* ----------------------
*     result
* ---------------------- */

#result {
  position: relative;
}

#result .sectiontitle {
  border-bottom: 4px solid #ffffff;
}

#resultbox {
  width: 100%;
  background: #0163b1;
  color: #ffffff;
}

#resultlist iframe {
  width: 100%;
  height: 400px;
  border: none;
  overflow-y: hidden;
  border: none;
}

/* -----------------------------------
*     history
* ------------------------------------ */

#history #pageheader {
  background: url(../img/history/pageheaderimg_sp.jpg);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
}

#history #pagetitle {
  font-size: 1.2rem;
  letter-spacing: -1px;
}

#firstcareer.historyblock {
  margin-bottom: 5rem;
}

.historyblock .innerblock {
  background: linear-gradient(to top, #559cd5, #559cd5) repeat-y 2.3rem/6px;
}

.careertitle {
  margin-bottom: 1rem;
  text-align: center;
  font-family: "DM Serif Text", serif;
  font-style: italic;
}

.careertitle span {
  font-size: 2rem;
  font-weight: bold;
  color: #636363;
}

.historybody {
  margin-left: 4.5rem;
  margin-right: 1rem;
}

.yearbox {
  margin-bottom: 1rem;
}

.yearbox:last-child {
  margin-bottom: 0;
  background: #ffffff;
}

.historyyearbox {
  text-align: left;
}

.historyyear {
  width: 80px;
  height: 80px;
  padding: 1rem 0;
  font-size: 1.1rem;
  font-weight: bold;
  color: #ffffff;
  line-height: 3.2rem;
  background: #559cd5;
  font-family: "DM Serif Text", serif;
}

.racketbox {
  background: #009c42;
  color: #ffffff;
  position: relative;
  top: -30px;
  left: 30px;
  border-radius: 2rem;
}

.racketicon {
  width: 1.5rem;
}

.historyimgbox {
  position: relative;
  top: -30px;
}

.historytxtbox p {
  margin-bottom: 0;
}

/* -----------------------------------
*     sponsor
* ------------------------------------ */

#sponsor #pageheader {
  background: url(../img/sponsor/pageheaderimg_sp.jpg);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
}

#sponsorblock {
  background: #f2f8ff;
}

#sponsorblock a {
  text-decoration: none;
  color: #212529;
}

#sponsorblock a .sponsorbox {
  background: #ffffff;
  transition: all 0.3s ease-out;
  -webkit-transition: all 0.3s ease-out;
}

#sponsorblock a:hover .sponsorbox {
  box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.25);
  transform: translateY(-0.1875em);
}

.sponsorname {
  font-weight: bold;
}

/* -----------------------------------
*     media
* ------------------------------------ */

#media #pageheader {
  background: url(../img/media/pageheaderimg_sp.jpg);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
}

#mediablock {
  background: #f2f8ff;
}

#mediablock .mediatitle {
  font-size: 1rem;
}

#mediablock h2.sectiontitle {
  color: #0066ad;
}

#mediablock .btn.btn-readmore,
#mediablock .btn.btn-readmore:visited {
  color: #0066ad;
  border: 1px solid #0066ad;
}

#mediablock .btn.btn-readmore:hover {
  color: #ffffff;
  background: #0066ad;
  border: 1px solid #0066ad;
}

#mediablock .articlebox a .zoominimg {
  overflow: hidden;
}

#mediablock .articlebox a .zoominimg img {
  -moz-transition: -moz-transform 0.2 s linear;
  -webkit-transition: -webkit-transform 0.2s linear;
  -o-transition: -o-transform 0.2s linear;
  -ms-transition: -ms-transform 0.2s linear;
  transition: transform 0.2s linear;
}

#mediablock .articlebox a:hover .zoominimg img {
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -o-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.2);
}

#mediablock .articlebox {
  position: relative;
}

#mediablock .articlebox .mediatitle {
  width: 100%;
  background: rgba(0, 98, 177, 0.45);
  bottom: 0;
  color: #ffffff;
  font-size: 0.9rem;
}

#mediablock .articlebox a:hover {
  text-decoration: none;
}

#mediablock .articlebox img {
  max-width: 100%;
  height: auto;
}

#mediablock .articlebox .mediadate {
  font-size: 0.9rem;
}

/* ----------------------
*     mediadetail
* ---------------------- */

#mediablock .mediadetailbox img {
  max-width: 100%;
  height: auto;
}

#mediablock .mediadetailbox .moviebox {
  max-width: 100%;
}

#mediablock .mediadetailbox .moviebox video {
  width: 100%;
}

/* -----------------------------------
*     astrel
* ------------------------------------ */

#astrel #pageheader {
  background: url(../img/astrel/pageheaderimg_sp.jpg);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
}

#astrelblock {
  background: #f2f8ff;
}

.astrelimg {
  width: 600px;
}

#astrel .btn.btn-readmore {
  padding: 1.5rem 4rem;
  color: #0066ad;
  font-size: 1.3rem;
  font-weight: bold;
  border: 2px solid #0066ad;
  border-radius: 0;
}

#astrel .btn.btn-readmore:hover {
  background: #0066ad;
  color: #ffffff;
  border: 2px solid #0066ad;
}

/* -----------------------------------
*     itf_article
* ------------------------------------ */
#itf_articleblock {
  background: #f2f8ff;
}

#itf_articleblock h2,
#itf_articleblock h3,
#itf_articleblock h4,
#itf_articleblock h5,
#itf_articleblock h6 {
  color: #0063b9;
}

.entrycontent img {
  max-width: 100%;
  height: auto;
  margin-bottom: 1rem;
}

#itf_articleblock .btn.btn-readmore,
#itf_articleblock .btn.btn-readmore:visited {
  color: #0066ad;
  border: 1px solid #0066ad;
}

#itf_articleblock .btn.btn-readmore:hover {
  color: #ffffff;
  background: #0066ad;
  border: 1px solid #0066ad;
}

/* ********************************************************************************************************************* */
@media screen and (min-width: 576px) {
  /* -----------------------------------
*     header
* ------------------------------------ */

  #headermenu.navbar-nav .nav-link {
    font-size: 1.4rem;
  }

  /* -----------------------------------
*     top
* ------------------------------------ */

  /* ----------------------
*     topgs
* ---------------------- */

  .topgsbox {
    height: 250px;
  }

  .topgsbox img {
    top: -50px;
  }

  /* ---------------------
*     topnews
* ---------------------- */

  .topnewsbody {
    font-size: 1rem;
  }

  /* ----------------------
*     topmedia
* ---------------------- */

  #topmedia iframe {
    width: 510px;
    height: 280px;
  }

  /* -----------------------------------
*     Overseas Expedition
* ------------------------------------ */

  /* ----------------------
*     expedition report
* ---------------------- */

  #expeditionreport iframe {
    width: 510px;
    height: 280px;
  }
}
/* ********************************************************************************************************************* */
@media screen and (min-width: 768px) {
  /* -----------------------------------
*     common
* ------------------------------------ */

  body {
    font-size: 1.2rem;
  }

  .sectionblock {
    padding: 70px 0;
  }

  .sectiontitle {
    font-size: 2.3rem;
  }

  /* -----------------------------------
*     header
* ------------------------------------ */

  .yonextennis {
    font-size: 0.6rem;
  }

  #headermenu.navbar-nav .nav-link {
    padding: 1.5rem 0;
    color: #ffffff;
    display: block;
    font-size: 1.7rem;
    line-height: 1.4rem;
  }

  #headermenu.navbar-nav .nav-link span {
    color: #9e9e9e;
    font-size: 0.8rem;
  }

  #headermenu.navbar-nav .sub-nav-link {
    padding: 0.5rem 0;
    color: #ffffff;
    display: block;
    font-size: 1.2rem;
    line-height: 1.2rem;
  }

  #headermenu.navbar-nav .sub-nav-link span {
    font-size: 0.6rem;
  }

  /* -----------------------------------
*     footer
* ------------------------------------ */

  .footermenutitle {
    font-size: 0.8rem;
  }

  #footer ul li a {
    font-size: 0.9rem;
    line-height: 2em;
  }

  /* -----------------------------------
*     top
* ------------------------------------ */

  /* ----------------------
*     slider
* ---------------------- */

  .bg-slider__title {
    bottom: 15%;
    right: 10%;
    width: 250px;
  }

  /* ----------------------
*     sponsorbnr
* ---------------------- */

  .sb-zero .sponsorbnrbox {
    width: 450px;
  }

  .sb-first .sponsorbnrbox {
    width: 210px;
  }

  .sb-first .sponsorbnrbox:nth-child(2) {
    width: 110px;
  }

  .sb-first .sponsorbnrbox:nth-child(3) {
    width: 160px;
  }

  .sb-second .sponsorbnrbox {
    width: 135px;
  }

  .sb-second .sponsorbnrbox:nth-child(4) {
    width: 85px;
  }

  /* ----------------------
*     topnews
* ---------------------- */

  #topnewstitlebox::before {
    font-size: 4rem;
  }

  #topnews iframe {
    width: 100%;
    height: 190px;
  }

  /* ----------------------
*     topgs
* ---------------------- */

  #gstitle {
    width: 600px;
  }

  .topgsbox {
    height: 300px;
  }

  .topgsbox img {
    top: -90px;
  }

  .topgsbox .txtbox .title {
    font-size: 2rem;
  }

  .topgsbox .txtbox .subtitle {
    font-size: 1rem;
  }

  /* ----------------------
*     tophisotry
* ---------------------- */

  #tophistory {
    padding: 7rem 0;
  }

  #tophistory .sectiontitle {
    font-size: 3rem;
  }

  #tophistory .blocktxt {
    font-size: 1.6rem;
  }

  /* ----------------------
*     topmedia
* ---------------------- */

  #topmedia iframe {
    width: 690px;
    height: 320px;
  }

  #topmedia .blocktxt {
    font-size: 1.6rem;
  }

  /* -----------------------------------
*     page
* ------------------------------------ */

  #pageheader {
    height: 450px;
  }

  #pageheadermsg {
    left: 3rem;
    bottom: 2rem;
    font-size: 2rem;
  }

  #pagetitle {
    font-size: 2.5rem;
  }

  /* -----------------------------------
*     Go for the GRAND SLAM
* ------------------------------------ */

  #gftgs .pageheader {
    background: url(../img/go-for-the-grand-slam/pageheaderimg.jpg);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
  }

  #gftgsmsg {
    font-size: 1rem;
  }

  /* ----------------------
*     gftgspv
* ---------------------- */

  #gftgspv:before {
    height: 6rem;
    content: "";
    display: block;
  }

  #gftgspv h2 {
    font-size: 1.6rem;
    font-weight: bold;
  }

  /* ----------------------
*     gftgsmenubox
* ---------------------- */

  .gftgsmenubox .txtbox {
    width: 500px;
    height: 140px;
    margin: -70px 0 0 -250px;
    position: absolute;
    z-index: 10;
    top: 50%;
    left: 50%;
    color: #ffffff;
  }

  .gftgsmenubox .txtbox .title {
    font-size: 2.2rem;
    font-weight: bold;
  }

  /* -----------------------------------
*     Junior Training Camps
* ------------------------------------ */

  #yonexjuniorprogram .sectiontitle {
    font-size: 1.9rem;
  }

  /* ----------------------
*     coach
* ---------------------- */

  .coachbox .txtbox {
    top: 65%;
  }

  .coachbox .txtbox .title {
    font-size: 1.7rem;
  }

  .advisorystaff {
    font-size: 0.9rem;
  }

  /* ----------------------
*     player
* ---------------------- */

  .playerbox .txtbox {
    top: 65%;
  }

  .playerbox .txtbox .title {
    font-size: 1.7rem;
  }

  /* ----------------------
*     camp report
* ---------------------- */

  #campreport .blocktxt {
    font-size: 1.6rem;
  }

  /* ----------------------
*     summary
* ---------------------- */

  #campsummaryimg {
    height: 350px;
  }

  #campsummary .btn.btn-readmore {
    padding: 1.5rem 3rem;
    font-size: 1.3rem;
  }

  /* ----------------------
*     past_activity
* ---------------------- */
  #past_activity .btn.btn-readmore {
    padding: 1.5rem 3rem;
    font-size: 1.3rem;
  }

  #past_activity .blocktxt {
    font-size: 1.6rem;
  }

  /* -----------------------------------
*     ITF
* ------------------------------------ */
  /* ----------------------
*     itf_area
* ---------------------- */
  .itfbox {
    height: 300px;
    position: relative;
    overflow: hidden;
  }

  /* ----------------------
*     taikai
* ---------------------- */

  #taikai table {
    font-size: 1.2rem;
  }

  #taikai table th {
    width: 25%;
  }

  #taikai table td {
    width: 75%;
  }

  #taikaiimg {
    height: 400px;
  }

  #taikai .btn.btn-readmore {
    padding: 1.5rem 3rem;
    font-size: 1.3rem;
  }

  /* -----------------------------------
*     Overseas Expedition
* ------------------------------------ */

  /* ----------------------
*     expedition report
* ---------------------- */

  #expeditionreport iframe {
    width: 690px;
    height: 280px;
  }

  /* -----------------------------------
*     history
* ------------------------------------ */

  #history #pagetitle {
    font-size: 2rem;
  }

  .careertitle span {
    font-size: 2.3rem;
  }

  /* -----------------------------------
*     sponsor
* ------------------------------------ */

  .sponsorbox img {
    width: 350px;
  }
}
/* ********************************************************************************************************************* */
@media screen and (min-width: 992px) {
  /* -----------------------------------
*     common
* ------------------------------------ */

  .sectionblock {
    padding: 50px 0;
  }

  .topsection {
    padding: 80px 0;
  }

  .sectiontitle {
    padding-bottom: 0.5rem;
    font-size: 3rem;
    border-bottom: 6px solid #0066ad;
  }

  .btn.btn-readmore {
    padding: 0.8rem 2rem;
    font-size: 1rem;
  }

  /* -----------------------------------
*     header
* ------------------------------------ */

  #header {
    height: 100px;
    padding: 0;
  }

  #headerlogo {
    width: 130px;
    z-index: 1100;
  }

  #headerlogo .logo {
    width: 100%;
    height: auto;
  }

  .yonextennis {
    font-size: 0.7rem;
    color: #ffffff;
  }

  .yonextennis:hover {
    color: #ffffff;
    text-decoration: none;
  }

  .navbar {
    padding: 0;
  }

  #header .navbar-collapse {
    height: auto;
    background: transparent;
    top: 0;
    overflow-y: visible;
  }

  #headermenu.navbar-nav {
    height: auto;
    margin-bottom: 0;
  }

  #headermenu li.nav-item {
    border-bottom: none;
  }

  #headermenu li.nav-item a {
    padding: 2rem 0;
  }

  #headermenu.navbar-nav .nav-link {
    padding: 1.5rem 1rem 0.7rem 1rem;
    font-size: 0.8rem;
  }

  #headermenu.navbar-nav .nav-link span {
    font-size: 0.7rem;
  }

  #headermenu.navbar-nav .nav-link.transparent {
    color: #ffffff;
  }

  #headermenu.navbar-nav .sub-nav-link {
    text-align: center;
  }

  /* ---------------------
*     dropdown
* ---------------------- */

  #headermenu.navbar-nav .dropdown {
    position: relative;
    display: inline-block;
  }

  #headermenu.navbar-nav .dropdown-content {
    display: none;
    position: absolute;
    background-color: #f7f7f7;
    width: 100%;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1;
  }

  #headermenu.navbar-nav .dropdown-content a.nav-link {
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    font-size: 0.9rem;
    color: #000000;
  }

  #headermenu.navbar-nav .nav-item .sub-nav-link.disabled {
    color: #9e9e9e;
  }

  #headermenu.navbar-nav .dropdown-content a:hover {
    color: #ffffff;
    background-color: #0066ad;
  }

  #headermenu.navbar-nav .dropdown:hover .dropdown-content {
    display: block;
  }

  /* -----------------------------------
*     footer
* ------------------------------------ */

  #footerlogo {
    width: 300px;
  }

  .footermenutitle {
    padding: 10px 0;
    font-size: 1rem;
  }

  #footermenu li {
    border-bottom: none;
  }

  #footer ul li a {
    font-size: 0.9rem;
    line-height: 2.3em;
  }

  /* -----------------------------------
*     top
* ------------------------------------ */

  /* ---------------------
*     slider
* ---------------------- */

  .sliderbox .src1 {
    background-image: url(../img/top/mainimg01.jpg);
  }
  .sliderbox .src2 {
    background-image: url(../img/top/mainimg02.jpg);
  }
  .sliderbox .src3 {
    background-image: url(../img/top/mainimg03.jpg);
  }

  .bg-slider__title {
    width: 300px;
    bottom: 35%;
    right: 10%;
  }

  /* ----------------------
*     sponsorbnr
* ---------------------- */

  #sponsorbnr {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    background: rgba(255, 255, 255, 0.5);
    transition: all 0.9s cubic-bezier(0.59, 0.02, 1, -0.09);
    animation: BottomToTop 0.3s;
    animation-fill-mode: both;
    animation-delay: 1.2s;
  }

  .sb-first .sponsorbnrbox {
    width: 220px;
  }

  .sb-first .sponsorbnrbox:nth-child(2) {
    width: 110px;
  }

  .sb-first .sponsorbnrbox:nth-child(3) {
    width: 160px;
  }

  /* ----------------------
*     topnews
* ---------------------- */

  #topnewstitlebox {
    width: 230px;
  }

  #topnewstitlebox .sectiontitle {
    font-size: 2rem;
  }

  #topnewstitlebox .btn.btn-readmore {
    padding: 0.5rem 1.3rem;
    position: static;
    right: 0;
    font-size: 1rem;
  }

  /* ----------------------
*     topgs
* ---------------------- */

  #gstitle {
    width: 500px;
  }

  .topgsbox {
    width: 33.3333%;
    height: auto;
    position: relative;
  }

  .topgsbox .anibox {
    position: relative;
  }

  .topgsbox img {
    position: static;
  }

  .topgsbox .zoominimg {
    overflow: hidden;
  }

  .topgsbox .zoominimg img {
    -moz-transition: -moz-transform 0.15s linear;
    -webkit-transition: -webkit-transform 0.15s linear;
    -o-transition: -o-transform 0.15s linear;
    -ms-transition: -ms-transform 0.15s linear;
    transition: transform 0.15s linear;
  }

  .topgsbox a:hover .zoominimg img {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
  }

  .topgsbox .txtbox .title {
    font-size: 1.5rem;
  }

  .topgsbox .txtbox .subtitle {
    font-size: 0.8rem;
  }

  #gstitlebox .btn.btn-readmore {
    position: absolute;
    top: 42%;
    right: 5%;
    color: #0066ad;
    border: 2px solid #0066ad;
  }

  /* ----------------------
*     coming soon
* ---------------------- */

  .topgsbox.comingsoon .txtbox .cstxt {
    bottom: 50%;
    font-size: 1.6rem;
    background: rgba(0, 102, 173, 0.7);
  }

  /* ----------------------
*     tophisotry
* ---------------------- */

  #tophistory {
    padding: 15rem 0;
    background: url("../img/top/historyimg.jpg") no-repeat top center;
    background-size: cover;
    background-attachment: fixed;
  }

  /* ----------------------
*     topmedia
* ---------------------- */

  #topmedia {
    padding: 5rem 0;
  }

  #topmedia iframe {
    width: 930px;
    height: 400px;
  }

  /* ----------------------
*     topsns
* ---------------------- */

  #topsns {
    margin-top: 8rem;
    padding: 5rem 0;
  }

  #topsns #snstitle {
    top: -6.5rem;
  }

  #topsns .snsicon {
    position: absolute;
    top: 10px;
    right: 0;
  }

  /* -----------------------------------
*     page
* ------------------------------------ */

  #pageheader {
    height: 500px;
  }

  #pageheadermsg {
    left: 5rem;
    bottom: 3rem;
    font-size: 3rem;
    text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.4);
  }

  #pagetitle {
    text-align: left;
  }

  /* -----------------------------------
*     news
* ------------------------------------ */

  #news #pageheader {
    background: url(../img/news/pageheaderimg.jpg);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
  }

  /* -----------------------------------
*     Go for the GRAND SLAM
* ------------------------------------ */

  #gftgs #pageheader {
    background: url(../img/go-for-the-grand-slam/pageheaderimg.jpg);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
  }

  #gftgsmsg {
    font-size: 1.2rem;
  }

  /* ----------------------
*     gftgspv
* ---------------------- */

  #gftgspv:before {
    height: 10rem;
    content: "";
    display: block;
  }

  #gftgspv h2 {
    font-size: 2.2rem;
  }

  /* ----------------------
*     gftgsmenubox
* ---------------------- */

  .gftgsmenubox {
    width: 90%;
    position: relative;
  }

  .gftgsmenubox .txtbox {
    width: 450px;
    height: 200px;
    margin: -100px 0 0 0;
    position: absolute;
    top: 50%;
    right: 6rem;
    left: auto;
    z-index: 10;
    color: #ffffff;
  }

  .gftgsmenubox .txtbox .title {
    font-size: 2.2rem;
  }

  .gftgsmenubox .txtbox .subtitle {
    font-size: 0.9rem;
  }

  .gftgsmenubox .txtbox .txt {
    font-size: 1rem;
  }

  .gftgsmenubox .txtbox .btn.btn-readmore {
    padding: 0.6rem 2rem;
  }

  /* ----------------------
*     coming soon
* ---------------------- */

  .gftgsmenubox.comingsoon .txtbox .cstxt {
    width: 250px;
  }

  /* -----------------------------------
*     Junior Training Camps
* ------------------------------------ */

  #gftgs_jtc #pageheader {
    background: url(../img/go-for-the-grand-slam/junior-training-camps/pageheaderimg.jpg);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
  }

  /* ----------------------
*     yonex junior program
* ---------------------- */

  #yonexjuniorprogram .sectiontitle {
    font-size: 2.5rem;
  }

  /* ----------------------
*     coach
* ---------------------- */

  .coachbox .txtbox {
    top: 75%;
  }

  .coachbox .txtbox .title {
    font-size: 2rem;
  }

  .advisorystaff {
    position: absolute;
    right: 0;
    bottom: 0;
    font-size: 0.8rem;
    z-index: 1000;
  }

  /* ----------------------
*     player
* ---------------------- */

  .playerbox .txtbox {
    top: 75%;
  }

  .playerbox .txtbox .title {
    font-size: 2rem;
  }

  /* ----------------------
*     camp report
* ---------------------- */

  #campreport .owl-theme .owl-nav {
    width: 100%;
    position: absolute;
    top: 30%;
  }

  #campreport .owl-theme .owl-nav .owl-prev {
    position: absolute;
    left: -5%;
  }

  #campreport .owl-theme .owl-nav .owl-next {
    position: absolute;
    right: -5%;
  }

  .owl-nav [class*="owl-"] {
    width: 40px;
    height: 40px;
    color: #ffffff !important;
    background: #0066ad !important;
  }

  /* ----------------------
*     summary
* ---------------------- */

  #campsummary .sectiontitle span {
    font-size: 1.8rem;
  }

  #campsummaryimg {
    height: 420px;
    background-attachment: fixed;
    background-size: 100% auto;
  }

  #campsummarybody dl dt {
    font-size: 2.5rem;
  }

  /* ----------------------
*     profile
* ---------------------- */

  #profilemain .container-fluid {
    padding-left: 0;
    padding-right: 0;
  }

  #profile {
    margin-top: 6rem;
  }

  #profilecareer .sectiontitle {
    font-size: 2.5rem;
  }

  #profilesummary #pagetitle span {
    font-size: 1.2rem;
  }

  #profilesummary dl {
    font-size: 1.1rem;
  }

  .lookforward-close-btn {
    top: 7rem !important;
    right: 2rem !important;
    left: auto !important;
  }

  .lookforward-close-btn._pattern1 {
    width: 75px !important;
    height: 75px !important;
    display: block;
    background: #b5b5b5 url(../img/icon/icon_close.png) no-repeat center center !important;
    border-radius: 0 !important;
  }

  /* -----------------------------------
*     Tournaments Overseas
* ------------------------------------ */

  #t-overseas #pageheader {
    background: url(../img/t-overseas/pageheaderimg.jpg);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
  }

  /* -----------------------------------
*     ITF
* ------------------------------------ */

  #gftgs_itf #pageheader {
    background: url(../img/itf_ehime/pageheaderimg.jpg);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
  }

  #ijlogo {
    width: 300px;
  }

  #ijlogolong {
    width: 800px;
  }

  /* ----------------------
*     itf_area
* ---------------------- */
  .itfbox {
    width: 33.3333%;
    height: auto;
    position: relative;
  }

  .itfbox .anibox {
    position: relative;
  }

  .itfbox img {
    position: static;
  }

  .itfbox .zoominimg {
    overflow: hidden;
  }

  .itfbox .zoominimg img {
    -moz-transition: -moz-transform 0.2 s linear;
    -webkit-transition: -webkit-transform 0.2s linear;
    -o-transition: -o-transform 0.2s linear;
    -ms-transition: -ms-transform 0.2s linear;
    transition: transform 0.2s linear;
  }

  .itfbox a:hover .zoominimg img {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
  }

  .itfbox .txtbox .title {
    font-size: 1.5rem;
  }

  .itfbox .txtbox .subtitle {
    font-size: 0.8rem;
  }

  .itfbox .itrtourlogo {
    width: 180px;
    height: 120px;
    margin: -60px 0 0 -90px;
  }

  /* ----------------------
*     coming soon
* ---------------------- */

  .itfbox.comingsoon .txtbox .cstxt {
    bottom: 44%;
    font-size: 1.6rem;
    background: rgba(0, 102, 173, 0.7);
  }

  /* ----------------------
*     taikai
* ---------------------- */

  #taikai .scheduletitle {
    font-size: 2rem;
  }

  #taikaischedule {
    width: 700px;
  }

  #taikaiimg {
    height: 500px;
    background-size: 100% auto;
    background-attachment: fixed;
  }

  #result {
    margin-top: 10rem;
    position: relative;
  }

  #resultbox {
    width: 70%;
    background: #0163b1;
    color: #ffffff;
    position: relative;
  }

  #resultimg {
    width: 350px;
    position: absolute;
    top: -3rem;
    left: -18rem;
  }

  #resultlist iframe {
    width: 80%;
    height: 600px;
    border: none;
    overflow-y: hidden;
  }

  /* -----------------------------------
*     media
* ------------------------------------ */

  #media #pageheader {
    background: url(../img/media/pageheaderimg.jpg);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
  }

  #mediablock h2.sectiontitle {
    font-size: 2rem;
  }

  /* ----------------------
*     mediadetail
* ---------------------- */

  #mediablock .mediadetailbox img {
    max-width: 800px;
    height: auto;
  }

  #mediablock .mediadetailbox .moviebox {
    max-width: 800px;
  }

  #mediablock .mediadetailbox .moviebox video {
    width: 100%;
  }

  /* -----------------------------------
*     history
* ------------------------------------ */

  #history #pageheader {
    background: url(../img/history/pageheaderimg.jpg);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
  }

  #firstcareer.historyblock {
    margin-bottom: 8rem;
  }

  #history #pagetitle {
    font-size: 2.5rem;
  }

  .historyblock .innerblock {
    margin-top: 4rem;
    background: linear-gradient(to top, #559cd5, #559cd5) repeat-y center/4px;
  }

  .careertitle {
    margin-top: 3rem;
  }

  .careertitle span {
    font-size: 3rem;
  }

  .historybody {
    margin-left: 0;
  }

  .racketbox {
    top: -81px;
    left: 30px;
  }

  .yearbox {
    margin-bottom: 0;
    background: transparent;
  }

  .historyyear {
    width: 120px;
    height: 120px;
    padding: 1rem 0;
    font-size: 2rem;
    line-height: 5.5rem;
  }

  .historyyearbox {
    text-align: center;
    position: relative;
  }

  .historyimgbox {
    width: 400px;
    position: relative;
    top: 0;
  }

  .historytxtbox {
    width: 400px;
    position: relative;
  }

  /* -----------------------------------
*     sponsor
* ------------------------------------ */

  #sponsor #pageheader {
    background: url(../img/sponsor/pageheaderimg.jpg);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
  }

  .sponsorbox .txtbox .txt {
    font-size: 0.9rem;
  }

  /* -----------------------------------
*     astrel
* ------------------------------------ */

  #astrel #pageheader {
    background: url(../img/astrel/pageheaderimg.jpg);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
  }

  #astrel .btn.btn-readmore {
    padding: 1.5rem 8rem;
  }
}
/* ********************************************************************************************************************* */
@media screen and (min-width: 1200px) {
  /* -----------------------------------
*     Common
* ------------------------------------ */

  body {
    font-size: 1.2rem;
  }

  /* -----------------------------------
*     header
* ------------------------------------ */

  #headermenu.navbar-nav .nav-link {
    font-size: 1rem;
  }

  /* -----------------------------------
*     top
* ------------------------------------ */

  /* ----------------------
*     slider
* ---------------------- */

  #slider .bg-title {
    font-size: 1.8rem;
  }

  .bg-slider__title {
    width: 450px;
    bottom: 30%;
    right: 10%;
  }

  /* ----------------------
*     topgs
* ---------------------- */

  #gstitle {
    width: 700px;
  }

  .topgsbox .txtbox .title {
    font-size: 1.6rem;
  }

  /* ----------------------
*     topmedia
* ---------------------- */

  #topmedia iframe {
    width: 1110px;
    height: 340px;
  }

  .gftgsmenubox .txtbox .title {
    font-size: 2.5rem;
  }

  /* -----------------------------------
*     Junior Training Camps
* ------------------------------------ */

  /* ----------------------
*     yonex junior program
* ---------------------- */

  #yonexjuniorprogram .txt br {
    display: inline;
  }

  /* ----------------------
*     camp report
* ---------------------- */

  #campreport iframe {
    width: 1110px;
    height: 320px;
  }

  /* ----------------------
*     summary
* ---------------------- */

  #campsummaryimg {
    height: 600px;
  }

  /* -----------------------------------
*     Overseas Expedition
* ------------------------------------ */

  /* ----------------------
*     expedition report
* ---------------------- */

  #expeditionreport iframe {
    width: 1110px;
    height: 280px;
  }

  /* -----------------------------------
*     ITF
* ------------------------------------ */

  #resultbox {
    width: 70%;
  }

  #resultimg {
    width: 400px;
    top: -3rem;
    left: -22rem;
  }

  /* -----------------------------------
*     history
* ------------------------------------ */

  .historytxtbox {
    width: 500px;
  }

  /* -----------------------------------
*     sponsor
* ------------------------------------ */

  .sponsorbox .txtbox .txt {
    font-size: 0.9rem;
    line-height: 1.8;
  }
}

/* ********************************************************************************************************************* */
@media screen and (min-width: 1400px) {
  /* -----------------------------------
*     common
* ------------------------------------ */

  .sectiontitle {
    font-size: 3.5rem;
  }

  /* -----------------------------------
*     top
* ------------------------------------ */

  /* ----------------------
*     topgs
* ---------------------- */

  #gstitle {
    width: 850px;
  }

  .topgsbox .txtbox .title {
    font-size: 2rem;
  }

  .topgsbox .txtbox .subtitle {
    font-size: 1rem;
  }

  /* -----------------------------------
*     page
* ------------------------------------ */

  #pagetitle {
    font-size: 3rem;
  }

  /* -----------------------------------
*     Go for the GRAND SLAM
* ------------------------------------ */

  /* ----------------------
*     gftgsmenubox
* ---------------------- */

  .gftgsmenubox .txtbox {
    right: 8rem;
  }

  /* -----------------------------------
*     Junior Training Camps
* ------------------------------------ */

  /* ----------------------
*     coach
* ---------------------- */

  .advisorystaff {
    font-size: 1rem;
  }

  /* ----------------------
*     profile
* ---------------------- */

  #profilesummary #pagetitle {
    font-size: 3rem;
  }

  /* -----------------------------------
*     ITF
* ------------------------------------ */

  #resultbox {
    width: 75%;
  }

  #resultimg {
    width: 480px;
    top: -3rem;
    left: -20rem;
  }

  /* ----------------------
*     itf_area
* ---------------------- */
  .itfbox .itrtourlogo {
    width: 300px;
    height: 200px;
    margin: -100px 0 0 -150px;
  }

  /* -----------------------------------
*     media
* ------------------------------------ */

  #mediablock h2.sectiontitle {
    font-size: 2.5rem;
  }

  /* -----------------------------------
*     history
* ------------------------------------ */

  #history #pagetitle {
    font-size: 3.5rem;
  }
}