body {
  min-height: 100vh;
  line-height: 1.6;
  font-size: 19px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	background: #ffffff;
  color: #232323;
}
a {
  color: inherit;
  transition: 0.2s;
}
.sec {
  margin: 0 0 56px;
}

.sec1 {
  margin: 0;
}

#container ,
#head  {
  width: 100%;
  max-width: 880px;
  margin: 0 auto;
  padding: 0 5%;
  box-sizing: border-box;
}
h3 {
    margin: 0px auto 32px;
    font-feature-settings: "palt";
    font-family: "新ゴ B";
    font-size: 194%;
    color: #F15600;
    text-align: center;
    font-weight: bold;
    line-height: 50px;
}
/* item
--------------------------------*/
.itm-ti-img {
  width: 100%;
  margin: 0 0 24px;
}
.itm-txt {margin: 0 0 24px;}
.itm-imgs {
  width: 100%;
  margin: 0 auto 32px;
  display: block;
}
.itm-imgs1 {
  width: 100%;
  margin: 0 auto 32px;
  display: block;
}
.itm-imgs.nm {margin: 0 auto;}
.item-img-txt {
  margin: 8px 0 32px;
  text-align: right;
  font-size: 14px;
  display: block;
}
.item-ul {
  margin: 0 0 24px;
  padding: 16px;
  font-size: 16px;
  border: 1px solid #ddd;
  background: #fcfcfc;
}
.item-li {
  margin: 0 0 8px 16px;
  list-style:disc;
}
.item-li:last-child {margin: 0 0 0 16px;}
.item-li.deco {font-size: 16px;}

.item-box {padding: 16px 8px;}
.item-box.by {background: #ffffb1;}

.deco {
  font-size: 20px;
  font-style: normal;
}
.deco.cp {color: #f0f;}
.deco.cr {color: #d80000;}
.deco.cb {color: #001224;
	font-weight: bold;}
.deco.by {background: #ffffb1;}
.deco.fb {font-weight: bold;}
.deco.sb {font-size: 24px;}
.deco.cc {color: #0068b7;
	background-image: linear-gradient(transparent 50%, #ffea00);
	font-weight: bold;}
.deco.cy {color: #d80000;
	background-image: linear-gradient(transparent 50%, #ffea00);
}
.deco.cz {color: #0068b7;
	font-weight: bold;
	font-size:22px;
	background-image: linear-gradient(transparent 10%, #ffea00);
}
.deco.ck {color: #d80000;
	font-weight: bold;
	font-size:30px;
	background: #fff100;
}
.deco.ce {color: #0068b7;
	font-weight: bold;
	font-display: italic;
}
.deco.cq {color: #d80000;
	font-weight: bold;
	font-size:30px;
	background: #fff100;;
}
/* voice-box*/
.voice_box {margin: 0px auto 55px;}

.clip-box {
    position: relative;
    padding: 0em 2em 2em 2em;
    background-color: #fff;
    color: #1b1b1b;
    border: 1px solid #ccc;
    box-shadow: 1px 1px 1px #acacac;
background:url(https://golflive.s3-ap-northeast-1.amazonaws.com/product/diretto/cotton-f.png) left top repeat;
	/*border-radius: 13px;*/
}

.clip-box::before {
    position: absolute;
    content: '';
    top: -15px;
    right: 55px;
    height: 55px;
    width: 15px;
    border: 3px solid #1b1b1b;
    background-color: none;
    border-radius: 12px;
    box-shadow: 1px 1px 2px #999;
    transform: rotate(10deg);
    z-index: 1;
}

.clip-box::after {
    position: absolute;
    content: '';
    top: 0px;
    width: 10px;
    right: 20px;
    border: solid 5px #fff;
    z-index: 2;
}
.bold{font-weight: bold;}
.red{color: #d80000;}
.clip-box h4 {
    background: url(https://s3-ap-northeast-1.amazonaws.com/golflive/product/img/icon-voice1.png) no-repeat 0px 3px;
    padding: 22px 0px 7px 0px;
    border-bottom: 1px solid #039;
    color: #d80000;
    font-weight: bold;
}
.clip-box {margin:0;}
.letter-p {
    background: url(https://s3-ap-northeast-1.amazonaws.com/spiritual-fx/lp/img/bg-noteline.gif) repeat;
    line-height: 40px;
}

/* btnAnime01 */

.btnAnime01 {
  -webkit-animation-name:btnAnime02;
  -webkit-animation-duration:1s;
  -webkit-animation-iteration-count:infinite;
  -webkit-animation-timing-function:ease;
  
  -moz-animation-name:btnAnime02;
  -moz-animation-duration:1s;
  -moz-animation-iteration-count:infinite;
  -moz-animation-timing-function:ease;
}
@-webkit-keyframes btnAnime02 {
  0% {-webkit-transform:translate(0, 0);}
  50% {-webkit-transform:translate(0, -8px);}
  100% {-webkit-transform:translate(0, 0);}
}
@-moz-keyframes btnAnime02 {
  0% {-moz-transform:translate(0, 0);}
  50% {-moz-transform:translate(0, -8px);}
  100% {-moz-transform:translate(0, 0);}
}

/*文字サイズ*/
.f10 { font-size: 10px;}
.f80 { font-size:80%;}
.f90 { font-size:90%;}
.f110 { font-size: 110%;}
.f120 { font-size: 120%;}
.f130 { font-size: 130%;}
.f140 { font-size: 140%;}
.f150 { font-size: 150%;}
.f165 { font-size: 165%;}
.f170 { font-size: 170%;}
.f190 { font-size: 190%;}
.f200 { font-size: 200%;}
.f210 { font-size: 210%;}
.f230 { font-size: 230%;}
.f250 { font-size: 250%;}
.f280 { font-size: 280%;}
.f300 { font-size: 300%;}

/* iframe要素内でサイズ指定している場合は必要なし */
.iframe {
  width: 560px;
  height: 315px;
}
/* CSSでレスポンシブ対応 */
/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }
 
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 769px) {
    .pc { display: none !important; }
    .sp { display: block !important; }
	.voice_box img { margin: 40px auto 4px;}
	img { max-width: 100%; }
	.clip-box h4 {padding: 51px 0px 7px 0px;}
}


@media screen and (max-width: 769px) {
 .vimeo {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
    margin-top: 20px;
    margin-bottom: 20px;
}
.vimeo iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
}
.voice_box img {
   /* width: 50%;*/
    margin: 40px 0 20px 34px;
}
.voice_box.clip-box {
    padding: 4%;
}
.ax-title {
    font-size: 1.7em;
    padding-left: 0.5em;
    border-left: 20px #0068B7 solid;
    border-bottom: 1px #0068B7 solid;
    margin: 1em 0 1.6em 0;
    color: #0068B7;
}

.profile {
  margin: 0 0 24px;
  padding: 16px;
  background: #ddfdee;
  overflow: hidden;
}
.profile-fig {
  width: 150px;
  margin: 0 0 0 16px;
  float: right;
}
.profile-img {
  width: 100%;
  margin: 0 0 8px;
}
.profile-name {
  line-height: 1.3em;
  font-size: 14px;
  display: block;
}

.nav {
  width: 100%;
  height: 340px;
  margin: 0 auto;
  position: relative;
}

.nav1 {
  width: 100%;
  height: 50px;
  margin: 0 auto 120px;
  position: relative;
}
.nav2 {
  width: 100%;
  height: 100px;
  margin: 0 auto;
  position: relative;
}
.nav-link {
  width: 550px;
  margin: auto;
  position: absolute;
  bottom: 70px;
  left: 0;
  right: 0;
  transition: 0.2s;
}
/*.nav-link:hover {width: 420px;}*/
.nav-link1 {
  width: 550px;
  margin: auto;
  position: absolute;
  left: 0;
  right: 0;
  transition: 0.2s;
}
/*.nav-link1:hover {width: 420px;}*/
.nav-img {width: 100%;}
.fluffy1{animation: fluffy1 3s ease infinite;}

.nav-link2 {
  width: auto;
  margin: 0 auto -150px;
  transition: 0.2s;
  align-content: center;
}
/*.nav-link2:hover {width: 420px;}*/
.nav-img {width: 100%;}
.fluffy1{animation: fluffy1 3s ease infinite;}
	
  @keyframes fluffy1 {
  0% { transform:translateY(0) }
  5% { transform:translateY(0) }
  10% { transform:translateY(0) }
  20% { transform:translateY(-15px) }
  25% { transform:translateY(0) }
  30% { transform:translateY(-15px) }
  50% { transform:translateY(0) }
  100% { transform:translateY(0) }
}
@keyframes arrowleft {
  0% {
    left: -24px;
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    left: -8px;
    opacity: 0;
  }
}


/* head
--------------------------------*/
.head-ti-img {width: 100%;}

#heads {
  width: 880px;
  margin: 16px auto 24px;
  padding: 0 0 24px;
  text-align: center;
  border-bottom: 1px solid #999;
}
.heads-name {
  height: 60px;
  margin: 0 0 16px;
  line-height: 60px;
  font-size: 24px;
  font-weight: bold;
  background: #ff9100;
  color: #fff;
}
.heads-sponsor {
  margin: 0 0 16px;
  text-align: right;
  font-size: 15px;
}
.heads-link {color: #0068b7;}
.heads-ti {
  font-size: 40px;
  font-weight: bold;
}

.heads-ti .hs.red {color: #d00;}
.heads-ti .hs.mid {font-size: 130%;}
.heads-ti .hs.big {font-size: 180%;}
.heads-ti .hs.bg {background: transparent linear-gradient(transparent 60%, rgb(255, 220, 120) 60%) repeat scroll 0% 0%;}



.heads-time {
  margin: 0 0 16px;
  text-align: right;
  font-size: 16px;
}


/* foot
--------------------------------*/
#foot {
  margin-top: auto;
  padding: 48px 0 0;
  text-align: center;
  font-size: 16px;
}
.siteLink {
  display: flex;
  justify-content: center;
}
.siteLink {margin: 0 0 24px;}
.siteLink-li {border-left: 1px solid #000;}
.siteLink-li:last-child {border-right: 1px solid #000;}
.siteLink-link {
  padding: 0 16px;
  color: #000;
  text-decoration: none;
  display: block;
}
.siteLink-link:hover {text-decoration: underline;}
.copyright {
  padding: 4px 0;
  background: #015a34;
  color: #fff;
  display: block;
}


@media screen and (max-width: 770px){
  #heads {
    width: auto;}
    .heads-ti {
      font-size: x-large;
      font-weight: bold;
  }
}
@media screen and (max-width: 980px) and (min-width: 770px){
  #head {
    width: 100%;
    padding: 0;
  }
}
@media screen and (max-width: 769px){
  #container, #head {
    width: 100%;
    overflow: hidden;
  }

  .itm-ti {
    width: 118%;
    margin-left: -8%;
    font-size: 22px;
  }

  .profile-fig {
    width: 230px;
    margin: 0 auto 16px;
    float: none;
  }

  .nav {
    width: 112%;
    height: 210px;
    margin: 0 0 0 -6%;
    background: url("https://golflive.s3-ap-northeast-1.amazonaws.com/product/golfing/draw_best/v3/nav-bg_sp.svg") no-repeat center center / 100% auto;
  }
	
	
  .nav-link {
    width: 270px;
    bottom: 45px;
    /*animation: vibrat 2s linear 0s infinite normal none running;*/
    transition: 0s;
  }

	.copyright{
    font-size: 14px;
  }

  .deco.cy {
    color: #d80000;
    background: transparent linear-gradient(transparent 60%, rgb(255, 220, 120) 60%) repeat scroll 0% 0%;
}

.deco.cc {
  color: #0068b7;
  background: transparent linear-gradient(transparent 60%, rgb(255, 220, 120) 60%) repeat scroll 0% 0%;
  font-weight: bold;
}

  /*@keyframes vibrat {
    0%   {left: 0; right:0}
    2.5% {left: 9px; right:0}
    5%   {left: 0; right: -9px;}
    7.5% {left: 0; right:0}

    10%   {left: 6px; right:0}
    12.5% {left: 0; right: -6px;}
    15%   {left: 0; right:0}

    17.5% {left: 3px; right:0}
    20%   {left: 0; right: -3px;}
    22.5% {left: 0; right:0}
  }*/	

  #head {padding: 0 2.5%;}
  .head-ti {
    width: 100%;
    margin: 0 0 32px;
    padding: 0 0 24px;
  }

  #foot {padding: 0;}
  .siteLink {font-size: 11px;}
}