@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css?family=Vidaloka&display=swap');

.mr10{ margin-right: 10px; }

.mb0{ margin-bottom: 0 !important; }
.mb10{ margin-bottom: 10px !important; }
.mb20{ margin-bottom: 20px !important; }
.mb30{ margin-bottom: 30px !important; }

.p0{padding: 0 !important; }
.pb0{padding-bottom: 0 !important; }
.pb5{padding-bottom: 5px !important; }
.pb10{padding-bottom: 10px !important;}
.pb20{ padding-bottom: 20px !important; }
.pb30{ padding-bottom: 30px !important; }
.pb40{ padding-bottom: 40px !important; }
.pb70{ padding-bottom: 70px !important; }

.td_u{ text-decoration: underline}

.c_r{ color: #dd0000; }

.small{ font-size: 0.75rem; }
.bold{ font-weight: bold;}

.main_contents .Copy,.main_contents .Copy2{
 font-size: 75%!important;
}

.main_contents .Copy3{
 padding-left: 0!important;
 margin-right: 0!important;
 font-size: 75%!important;
}

.txt_c{ text-align: center;}
.txt_r{ text-align: right;}
.txt_d{ text-align: center; font-size: 1.0rem; font-weight: bold; }
.txt_l{ text-align: left !important;}

.txt_pi{ color: #e071b6!important; }
.txt_gr{ color: #91c3ca!important; }

.img_line{
 border: 1px solid #dcdcdc;
 box-sizing: border-box;
}
.box_area {
 padding: 2%;
 border: 1px solid #bababa;
}
.link_text {
 font-weight: 600;
 color: #df2764;
} 

/*==========================================
 pc/tab
===========================================*/
@media screen and (min-width: 801px) {
 .pc_none {
  display: none;
 }
 
 /*flex*/
 .pc_flex {
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-align-items: stretch;
  align-items: stretch;
 }
}

body {
	margin: 0px auto;
 padding: 0px;
	height: 100%;
 font-size: 16px;
	line-height: 1.6;
	font-family: "游ゴシック",YuGothic,"メイリオ",Meiryo,sans-serif;
 color: #323232;
}

img{
 width: 100%;
 height: auto;
 vertical-align: bottom;
}

a{
 text-decoration: none;
 -webkit-transition: all .3s;
 transition: all .3s;
}

strong{
 font-weight: bold;
}

/*ページタイトル*/
.pageTit{
 margin-bottom: 40px;
 padding: 20px 0px; 
 font-size: 312.5%;
 font-family: 'Vidaloka', serif;
 text-align: center;
 color: #fff;
 background: -webkit-linear-gradient(bottom right, #e4477b 25%, #df2764 25%, #df2764 50%, #e4477b 50%, #e4477b 75%, #df2764 75%, #df2764);
 background: linear-gradient(to top left, #e4477b 25%, #df2764 25%, #df2764 50%, #e4477b 50%, #e4477b 75%, #df2764 75%, #df2764);
 background-size: 6px 6px;
}

/*見出し*/
.mi01{
	margin-bottom: 16px;
 padding-bottom: 10px;
 font-weight: bold;
	font-size: 125%;
 line-height: 1.6;
 color: #323232; 
 border-bottom: 1px solid #df2764;
}

.mi02{
 padding: 10px 2%;
 font-size: 175%;
 font-weight: bold;
 text-align: center;
 color: #FFF;
 background: #323232;
}

.mi03{
 padding: 10px 0px; 
 font-size: 120%;
 font-weight: bold;
 text-align: left;
 color: #df2764;
}

.mi04{
 margin-bottom: 60px;
 padding: 10px 0px;
 font-size: 175%;
 font-weight: bold;
 text-align: center;
 border-bottom: 2px solid #df2764;
}

.mi05{
	margin-bottom: 16px;
 padding: 2%;
 font-weight: bold;
	font-size: 125%;
 line-height: 1.6;
 color: #FFF;
 background: #df2764;
}


/*ボタン*/
.bt01{
 margin: 0 auto;
 width: 40%;
 text-align: center;
}

@media screen and (min-width: 801px) {
 .bt01{
  min-width: 400px;
 }
}

.bt01 a {
 padding: 16px 0;
 width: 100%;
 color: #fff!important;
 font-size: 100%;
 font-weight: bold;
 display: inline-block;
 position: relative;
 overflow: hidden;
 z-index: 1;
 text-decoration: none!important;
}

.bt01 a:after {
 width: 100%;
 height: 100%;
 background-color: #323232;
 content: '';
 position: absolute;
 bottom: 0;
 left: 0;
 z-index: -2;
}

.bt01 a:before {
 width: 0%;
 height: 100%;
 background-color: #df2764;
 content: '';
 position: absolute;
 bottom: 0;
 left: 0;
 z-index: -1;
 -webkit-transition: all .3s;
 transition: all .3s;
}

@media screen and (min-width: 801px) {
 .bt01 a:hover {
  color: #fff;
 }

 .bt01 a:hover:before {
  width: 100%;
 }
}

.bt02{
 margin: 0 auto 20px;
 padding: 0!important;
 width: 50%;
 text-align: center;
}

.bt02 a{
 padding: 16px 4%;
 width: 100%;
 position: relative;
 font-weight: bold;
 color: #df2764;
 border: 2px solid #df2764;
 overflow: hidden;
 display: inline-block;
 -webkit-transition: all 0.3s ease-in-out;
 transition: all 0.3s ease-in-out;
 box-sizing: border-box;
}

.bt02 a:before{
 content: "";
 z-index: -1;
 position: absolute;
 width: 100%;
 height: 100%;
 top: 0;
 left: -100%;
 background-color: #df2764;
 -webkit-transition: all 0.3s ease-in-out;
 transition: all 0.3s ease-in-out;
}

@media screen and (min-width: 801px) {
 .bt02 a:hover{
  color: #ecf0f1;
 }

 .bt02 a:hover:before{
  left: 0;
 }
}

.wrapper{
	margin: 0;
	padding: 0px 0px 243px;
	height: 100%;
	min-height: 100%;
 position: relative;
}

.container{
	margin: 0px auto;
 width: 92%;
	max-width: 1000px;
 box-sizing: border-box; 
}

.container .main_contents {
 margin: 0 auto 50px;
 padding: 28px 3%;
 border: 2px solid #323232; 
}

.main_contents .ph{
 width: 40%;
}

@media screen and (min-width: 801px) {
 .container a:hover img {
  opacity: 0.8;
 }
}

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

header {
 padding: 20px 0px;
}

header .container{
 display: -webkit-flex;
 display: flex;
 -webkit-flex-wrap: wrap;
 flex-wrap: wrap;
 -webkit-justify-content: space-between;
 justify-content: space-between;
 -webkit-align-items: stretch;
 align-items: stretch;
}

header .logo{
 padding: 10px 0px;
 width: 30%;
 display: -webkit-flex;
 display: flex;
 -webkit-align-items: center;
 align-items: center;
}

header nav{
 width: 50%;
 display: -webkit-flex;
 display: flex;
 -webkit-align-items: center;
 align-items: center;
}

header nav .menu{
 width: 100%;
 display: -webkit-flex;
 display: flex;
 -webkit-flex-wrap: wrap;
 flex-wrap: wrap;
 -webkit-justify-content: space-between;
 justify-content: space-between;
 -webkit-align-items: stretch;
 align-items: stretch;
}

header .menu li{
 font-size: 150%;
 font-family: 'Vidaloka', serif;
}

header .menu li a{
 color: #323232;
}

@media screen and (min-width: 801px) {
 header .menu li a:hover {
  color: #df2764;
 }
}

/*-------------footer-------------*/
footer {
	padding: 40px 0 20px;
	width: 100%;
	font-size: 0.8125rem;
	text-align: center;
	color: #fff;
 background: -webkit-linear-gradient(bottom right, #e4477b 25%, #df2764 25%, #df2764 50%, #e4477b 50%, #e4477b 75%, #df2764 75%, #df2764);
 background: linear-gradient(to top left, #e4477b 25%, #df2764 25%, #df2764 50%, #e4477b 50%, #e4477b 75%, #df2764 75%, #df2764);
 background-size: 6px 6px;
 box-sizing: border-box;
 clear: both;
 display: block;
	position: absolute;
 bottom: 0
}

footer a {
	color: #fff;
}

.footer_contents img {
	width: 250px;
	margin: 0 20px;
}

.footer_link {
	margin: 40px 0px 20px;
	display: block;
}

.footer_link a{
 margin: 0px 6px;
 text-decoration: underline;
}

.footer_link a:hover{
 text-decoration: none;
}


@media screen and (max-width: 800px) {
/*==========================================
 smp
===========================================*/
 .sp_none {
  display: none;
 }

 body {
  font-size: 13px;
 }
 
 /*ページタイトル*/
 .pageTit{
  padding: 16px 0px; 
  font-size: 230%;
 }
 
 /*見出し*/

 .mi02{
  font-size: 123%;
 }

 .mi04{
  margin-bottom: 30px;
  font-size: 138%;
 }
 
 /*ボタン*/
 .bt01{
  width: 90%;
 }

 .bt01 a{
   background-color: #df2764;
  }

 .bt01 a:before,
 .bt01 a:after{
  content: none;
 }

 .bt02{
  margin: 0 auto;
  width: 85%;
 }
 
 .wrapper {
  padding: 18% 0 0;
  height: auto;
  min-height: 0;
  position: static;
 } 

 .container .main_contents {
  margin: 0 auto 30px;
  padding: 16px 4%;
 }

 .main_contents .ph{
  width: 40%;
 }
 


 /*-------------header-------------*/
 header{
  padding: 16px 0%;
  width: 100%;
  background-color: #FFF;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
 }

 header .container{
  align-items: center;
 }

 header .logo{
  padding: 0px;
  width: 50%;
 }

 header .menu-trigger,
 .menu-trigger span {
  display: inline-block;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all  0.5s ease;
  box-sizing: border-box;
 }

 header .menu-trigger {
  position: relative;
  width: 28px;
  height: 18px;
  z-index: 999;
 }

 header .menu-trigger span {
  position: absolute;
  right: 0;
  width: 100%;
  height: 2px;
  background-color: #df2764;
 }

 header .menu-trigger span:nth-of-type(1) { top: 0; }
 header .menu-trigger span:nth-of-type(2) { top: 8px; }
 header .menu-trigger span:nth-of-type(3) { bottom: 0; }

 header .menu-trigger.active span:nth-of-type(1) {
  -webkit-transform: translateY(9px) rotate(-45deg);
  transform: translateY(9px) rotate(-45deg);
 }

 header .menu-trigger.active span:nth-of-type(2) {
  opacity: 0;
 }

 header .menu-trigger.active span:nth-of-type(3) {
  -webkit-transform: translateY(-7px) rotate(45deg);
  transform: translateY(-7px) rotate(45deg);
 }

 header nav{
  margin: 0px auto;
  width: 100%;
  height: 100%;
  background-color: rgba(255,255,255,0.95);
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
 }

 header nav.active{
  display: block;
 } 

 header nav .menu{
  margin: 80px auto 0px;
  width: 100%;
 }

 header .menu li{
  width: 100%;
  text-align: center;
  border-bottom: 1px solid #df2764;
 }

 header .menu li:first-child{
  border-top: 1px solid #df2764;
 }

 header .menu li a{
  padding: 10px 0px;
  display: block;
 }



 /*-------------footer-------------*/
 footer {
  padding: 30px 0;
  width: 100%;
  font-size: 0.8rem;
  text-align: center;
  color: #fff;
  background-color: #ebacc7;
  box-sizing: border-box;
  display: block;
  position: static;
 }

 footer a {
  color: #fff;
 }

 .footer_contents img {
  margin: 0px auto 10px;
  display: block;
  width: 40%;
 }

 .footer_link {
  margin: 40px 0px 20px;
  display: block;
 }

 .footer_link {
  margin: 0px 0px 20px;
  display: block;
 }

 .footer_link a{
  margin: 0px 2px;
  text-decoration: underline;
 }


}