@charset "UTF-8";
@import url("global.css");

#cover{
  position: relative;
  margin: auto auto 6vw auto;
  border-bottom: 2vw solid #4169e1;
  /*height: 100vh;*/
}
.content{
	border-bottom: 1px solid #22222238;
}


/*---------------------------------------------------*/
#con-profile{
  background-image: url(../img/top/02.jpg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  height: 38vh;
  position: relative;
}
.con-btn-profile{
  position: absolute;
  top: 10vh;
  left: 2vw;
  text-decoration: none;
  font-size: 3.6vw;
  font-weight: 200;
  vertical-align: sub;
  color: #222222;
  padding: 2% 4% 1% 4%;
  border: double 4px #fff;
  background-color: rgba(255,255,255,0.76);
  border-radius: 2px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
}
.con-btn-profile::before{
  font-size: 2.6vw;
  font-weight: 200;
  padding: 0 3vw 0 0;
  font-family: Fontisto;
  content: "\e977";
}
@media screen and (min-width: 479px) {
  #con-profile{
    height: 80vh !important;
  }
  .con-btn-profile{
    top: 60vh !important;
    padding: 1% 6% !important;
    font-size: 2vw !important;
  }
  .con-btn-profile::before{
    font-size: 1vw !important;
  }
  .con-btn-profile:hover{
    color: #fff !important;
    background-color: rgba(65,105,225,1) !important;
  }
}

/*---------------------------------------------------*/
#con-policy{
  background-image: url(../img/top/03.jpg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  height: 38vh;
  position: relative;
}
.con-btn-policy{
  position: absolute;
  top: 10vh;
  right: 2vw;
  text-decoration: none;
  font-size: 3.6vw;
  font-weight: 200;
  vertical-align: sub;
  color: #222222;
  padding: 2% 4% 1% 4%;
  border: double 4px #fff;
  background-color: rgba(255,255,255,0.76);
  border-radius: 2px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
}
.con-btn-policy::before{
  font-size: 2.6vw;
  font-weight: 200;
  padding: 0 3vw 0 0;
  font-family: Fontisto;
  content: "\e977";
}
@media screen and (min-width: 479px) {
  #con-policy{
    height: 80vh !important;
  }
  .con-btn-policy{
    font-size: 2vw !important;
    padding: 1% 0 !important;
  }
  .con-btn-policy::before{
    font-size: 1.6vw !important;
  }
  .con-btn-policy:hover{
    color: #fff !important;
    background-color: rgba(65,105,225,1) !important;
  }
}

/*---------------------------------------------------*/
#con-policy-text{
  width: 100%;
  padding: 10% 4%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}
#con-policy-text > h2{
  font-size: 4.6vw;
  font-weight: 400;
  vertical-align: middle;
  display: inline-block;
  margin: auto auto 2vh auto;
padding-bottom: .5em;
border-bottom: .5px solid #4169e1;
font-weight: bold;
}
#con-policy-text > h2::first-letter {
  font-size: 7vw;
  color: #4169e1;
}
#con-policy-text > p{
  font-size: 3.6vw;
  font-weight: 200;
  text-align:left;
}
@media screen and (min-width: 479px) {
  #con-policy-text > h2{
   font-size: 3.6vw !important;
  }
  #con-policy-text > h2::first-letter {
    font-size: 5vw !important;
    color: #4169e1 !important;
  }
  #con-policy-text > p{
    font-size: 2.2vw !important;
    font-weight: 200 !important;
    text-align:left !important;
  }
}

/*---------------------------------------------------*/
#con-activity{
  margin: 2vh auto 4vh auto;
}
#con-activity > h2{
  font-size: 5vw;
  font-weight: 300;
  color: #4169e1;
  text-align: left;
  margin: auto auto 1vw 4vw;
  padding: 0 0 0 4vw;
  border-left: 4px solid #99bde0;
}
#con-activity > ul{
  width: 96%;
  margin: auto;
}
#con-activity > ul li{
  vertical-align: top;
  display: inline-block;
  width: 49%;
  text-align: left;
}
#con-activity > ul li:nth-child(even){
  margin: 2% auto 2% 1%;
}
#con-activity > ul li:nth-child(odd){
  margin: 2% 1% 2% auto;
}
#con-activity > ul li > a{
  display: block;
  text-decoration: none;
  color: #4169e1;
}
#con-activity > ul li > a > h3{
  height: 50vw;
  overflow: hidden;
}
#con-activity > ul li > a > p{
  margin: 1vh auto;
  font-size: 3vw;
}
#con-activity > ul li > a > span{
  vertical-align: middle;
  display: inline-block;
  color: #42515a;
}
#con-activity > ul li > a > span::before{
  vertical-align: middle;
  display: inline-block;
  font-size: 1.6vw;
  font-weight: 200;
  padding: 0 1vw 0 0;
  margin: -.5vh auto auto auto;
  font-family: Fontisto;
  content: "\e96a";
}

@media screen and (min-width: 479px) {
  #con-activity > h2{
    font-size: 4vw !important;
  }
  #con-activity > ul li > a > p{
    font-size: 1.8vw !important;
  }
  #con-activity > ul li > a > span{
    font-size: 1.6vw !important;
  }
  #con-activity > ul li > a > span::before{
    font-size: 1.2vw !important;
  }
  #con-activity > ul li > a:hover{
    opacity: 0.6 !important;
  }
}

/*---------------------------------------------------*/
#con-youtube{
  margin: 2vh auto 4vh auto;
}
#youtube-ul{
  width: 96vw;
  margin: auto;
}
#youtube-ul li{
  margin: 2vw auto;
}
#youtube-ul li > iframe{
}
#youtube-p{
  width: 84vw;
  margin: auto auto 10px;
  border-radius: 4px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  background-color: #4168e4;
}
#youtube-p > a{
  position: relative;
  display: block;
  padding: 2vw 0;
  font-size: 4vw;
  color:  #fff;
  text-decoration: none;
}
#youtube-p > a::before{
  position: absolute;
  left: 2vw;
  top: 2.5vw;
  font-size: 3vw;
  font-family: Fontisto;
  content: "\e9e4";
}


/*---------------------------------------------------*/
#con-greeting{
  padding: 4% 0 0 0;
}
#con-greeting > h2{
  font-size: 5vw;
  font-weight: 300;
  color: #4169e1;
  text-align: left;
  margin: auto auto 1vw 4vw;
  padding: 0 0 0 4vw;
  border-left: 4px solid #99bde0;
}
#con-greeting > h3{
  font-size: 4.6vw;
  font-weight: 200;
  padding: 1vw 0;
  color: #222222;
  font-weight:bold;
  text-align: left;
  margin: 0 20px;
}
#con-greeting > div{
  background-image: url(../img/top/04.jpg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  height: 38vh;
  position: relative;
}
#con-greeting > div > p{
  position: absolute;
  top: 6vw;
  right: 2vw;
  font-size: 3.6vw;
  font-weight: 400;
  width: 50%;
  color: #fff;
  text-align: left;
  padding: 2vw;
  background-color: rgba(51,51,51,0.6);
}
@media screen and (min-width: 479px) {
  #con-greeting > h2{
    font-size: 4vw !important;
  }
  #con-greeting > div{
    height: 80vh !important;
  }
  #con-greeting > div > h3{
    font-size: 3vw !important;
  }
  #con-greeting > div > p{
    font-size: 2vw !important;
  }
}

/*---------------------------------------------------*/
#sunflower-time{
  margin: 2vw auto;
}
#sunflower-time > a{
  display: block;
}
#sunflower-time > a > img{
  width: 98%;
  font-size:0;
  border-radius: 4px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  box-shadow:0px 2px 2px 0px #a3a3a3;
}


.daiji {
  width: 26vw;
  position: absolute;
  z-index: 99;
  top: 8vw;
  right: 15vw;
}