@import url('https://fonts.googleapis.com/earlyaccess/notosansjapanese.css');

body{
 font-family:"Noto Sans JP","Arial","ヒラギノ丸ゴ ProN","メイリオ",sans-serif;
}
.mt30{
 margin-top: 30px;
}
.mt80{
 margin-top: 80px;
}
/*-------------------------
header
-------------------------*/
header{
 position: sticky;
 top: 0;
 z-index: calc(infinity);
}
.header-inner{
 display: flex;
 justify-content: space-between;
 background-color: #fff;
 box-shadow: 0 3px 10px #808080;
 color:#098693;
 padding: 10px 20px;
 position: sticky;
 top: 0;
}
.logo-box{
 display: flex;
 align-items: center;
}
.logo-box p{
 padding-left: 15px;
}
.header-right{
 display: flex;
 align-items: center;
}
input{
 outline: none;
 color:#111111;
}
.search{
 display: flex;
 border: solid 2px #4b4b4b;
 border-radius: 15px;
 padding: 7px 10px;
 margin-right: 20px;
}
.top-btn{
 display: -webkit-flex;
 display: -moz-flex;
 display: -ms-flex;
 display: -o-flex;
 display: flex;
 text-align: center;
 align-items: center;
}
.top-btn >.on-color{
 background-color: #fef5e6;
}
.top-btn >li{
 background-color: #fff;
 -webkit-transition: all 0.3s ease;
 -moz-transition: all 0.3s ease;
 -o-transition: all 0.3s ease;
 transition: all  0.3s ease;
 margin: 0 10px;
 padding: 7px 13px;
 border: solid 2px #098693;
 border-radius: 17px;
 width: 130px;
}
.top-btn >li:hover{
 background-color: #fef5e6;
}
.top-btn >li >a{
 display: block;
 width: 100%;
}
.top-box01{
 display: flex;
 align-items: center;
 justify-content: center;
 background-color: #f7869e;
 padding: 20px 0;
}
.top-box01 p{
 color:#fff;
 font-size: 1.7em;
 line-height: 1.4em;
 letter-spacing: 0.15em;
 padding-right: 40px;
}
.top-btn-tablet,
.top-img-smt{
 display: none;
}
/*-------------------------
main
-------------------------*/
#privacy_main,
#terms_main{
 display: -webkit-flex;
 display: -moz-flex;
 display: -ms-flex;
 display: -o-flex;
 display: flex;
 padding: 0 3% 0;
 margin: 70px 0;
}
/*--左サイド--*/
.leftside{
 border-right: solid 1px #afafaf;
 padding-right: 50px;
 width: 18%;
}
.cm{
 position: relative;
}
.leftside div:nth-of-type(2){
 margin: 50px 0 20px;
}
.cm> span{
 position: absolute;
 top: 0;
 left: 0;
 font-size: 0.7em;
 background: #fff;
 opacity: 0.8;
 padding: 1px 2px;
}
/*--右サイド--*/
.h2{
 background-color: #098693;
 color: #fff;
 font-size: 2em;
 padding: 7px 0 7px 15px;
}
.rightside{
 margin-left: 3%;
 width: 82%;
}
.rightside p{
 letter-spacing: 0.08em;
 line-height: 1.4em;
}
.terms{
 padding-left: 15px;
 letter-spacing: 0.08em;
}
.terms >dt{
 margin-top: 40px;
 font-weight: 100;
 font-size: 1.5em;
}
.terms >dd{
 padding-left: 20px;
 margin-top: 10px;
 line-height: 1.4em;
 background-image: url("../images/icon.png");
 background-repeat: no-repeat;
 background-position: 7px 9px;
 background-size: 6px;
}
.notes{
 margin-top: 40px;
 font-size: 0.8em;
}
.txt-link {
 color: #098693;
 text-decoration: underline;
}

/*--- #privacy_main ---*/
#privacy_main .terms >dd{
 margin-top: 14px;
 background-image: none;
 padding-left: 0;
}

/*-------------------------
footer
-------------------------*/
.footer{
}
.note{
 background-color: #f7869e;
 color: #fff;
 text-align: center;
 padding: 15px 5%;
 font-size: 1.15em;
 line-height: 1.5em;
}
.note a{
 border-bottom: solid 1px #fff;
}
.footer-wrapper{
 background-color: #dcdcdc;
 padding: 20px 5%;
 text-align: center;
}
.footer-box{
 display: flex;
 justify-content: center;
}
ul.footer-text{
 display: flex;
}
ul.footer-text li{
 display: flex;
 align-items: center;
 padding: 0 15px;
 border-right: solid 1px #111;
 height: 25px;
}
ul.footer-text li:last-child{
 border-right: 0;
}
.copyright{
 padding-top: 20px;
}

@media screen and (max-width: 1024px) {
	/* 1024px以下に適用されるCSS（タブレット用） */
 .header-inner{
  box-shadow: none;
 }
 .top-btn-tablet{
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  text-align: center;
  align-items: center;
  justify-content: center;
  padding: 6px 0;
  background-color: #f7869e;
  color: #ffffff;
 }
 .top-btn-tablet >li:not(:last-child){
  border-right: 1px solid #ffffff;
 }
 .top-btn-tablet >li >a{
  padding: 5px 13px;
  display: block;
  width: 100%;
 }
 .leftside{
  display: none;
 }
 .rightside{
  width: 100%;
  margin-left: 0;
 }
 #privacy_main,
 #terms_main{
  margin-top: 20px;
 }
 .top-btn,
 .none{
  display: none;
 }
}

@media screen and (max-width: 480px) {
	/* 480px以下に適用されるCSS（スマホ用） */
 img{
  width: 100%;
 }
 .h2{
  font-size: 1.7em;
 }
 .header-inner{
  padding: 10px 3%;
 }
 .logo-box{
  width: 35%;
 }
 .logo-box> img{
  max-width: 85%;
 }
 .header-right{
  justify-content: flex-end;
  width: 50%;
 }
 .search{
  margin-right: 0;
 }
 .search-img{
  max-width: 18px;
  height: auto;
 }
 .top-box01{
  padding: 20px 3%;
  font-size: 0.7em;
 }
 .top-box01 img{
  max-width: 80%;
 }
 #privacy_main,
 #terms_main{
  margin-top: 0;
  padding: 0 4% 0;
 }
 .footer-wrapper{
 padding: 20px 3%;
 }
 .none{
  display: none;
 }
 /*--- #privacy_main ---*/
 #privacy_main .terms{
  padding-left: 0;
 }
 /*--- #terms_main ---*/
 #terms_main .terms >dt:first-child{
  margin-top: 20px;
 }
}