﻿@charset "utf-8";
@import url("*");
/*
Theme Name: ayayagakkou.com new
*/


/* ========RESET======== */
body,div,dl,dt,dd,ul,ol,li,
h1,h2,h3,h4,h5,h6,
pre,code,form,fieldset,legend,
p,blockquote,table,th,td {margin: 0; padding: 0;}

* {
 margin:0;
 padding:0;
}

html,body {background: #FFF; color: #000;}

body {font-size: 100%;"Meiryo","Hiragino Kaku Gothic Pro",,sans-serif;}
* html body {font-size: small;}
*:first-child+html body {font-size: small;}

img {border: 0; vertical-align: top;}

h1,h2,h3,h4,h5,h6 {clear: both; font-weight: normal;text-align:left;}

ul,dl,ol {text-indent: 0;}
li {list-style: none;}

address,caption,cite,code,dfn,em,strong,th,var {font-style: normal; font-weight: normal;}

sup {vertical-align: text-top;}
sub {vertical-align: text-bottom;}

input,textarea,select {font-family: inherit; font-size: inherit; font-weight:inherit;}
* html input,* html textarea,* html select {font-size: 100%;}
*:first-child+html+input,*:first-child html+textarea,*:first-child+html select {font-size: 100%;}

table {border-collapse: collapse; border-spacing: 0; font-size: inherit;}
th,td {text-align:left; vertical-align: top;padding-left:10px;}
caption {text-align: left;}

pre,code,kbd,samp,tt {font-family: monospace;}
* html pre,* html code,* html kbd,* html samp,* html tt {font-size: 100%; line-height: 100%;}
*:first-child+html pre,*:first-child html+code,*:first-child html+kbd,*:first-child+html+samp,*:first-child+html tt {font-size: 108%; line-height: 100%;}

input,select,textarea {font-size: 100%; font-family: Verdana, Helvetica, sans-serif;}

p {
	text-align: left;
	padding:0 20px;
}

/* ========BASIC======== */

html{
	width:100%;
}

body{
	width:100%;
	margin:0;
	padding:0;
	text-align:center;
	margin:0 auto;
	overflow-x: auto;
	box-sizing: border-box;
	z-index:9999;
	color:#545454;
	font-size:15px;
	line-height:2.0em;
	font-weight:bold;
	font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,メイリオ,Meiryo,serif;}

a {
color: #545454;
text-decoration: none;
}

a:hover {
color: #179a4c;
text-decoration: underline;
}

#wrapper{
	width:100%;
	max-width:1050px;
	text-align:left;
	margin:0 auto;
	overflow-x: hidden !important;
	box-sizing: border-box;
}

#clear{
	clear:both;
}

img{
	width:100%;
	max-width:100%;
	-webkit-backface-visibility: hidden !important;
}

.clear{
	clear:both;
}

/* IE用 */
 
@font-face {
	font-family:MyWebFont;
	src: url(segoe-print-bold.ttf);
}
 
/* IE以外用 */


@font-face {
	font-family:MyWebFont;
	src: url(segoe-print-bold.ttf) format('ttf');
}

/* ========header======== */

#site{
	width:1050px;
	margin:0 auto;
}

#menu{
	width:1050px;
	margin:0 auto;
}

.logo{
	width:300px;
	float:left;
}

.sns{
	z-index:9999;
	float:right;
}

.sns ul{
	width:125px;
	padding: 0;
	margin:0;
	display:inline;
}

.sns li{
	float: left;
	width:30px;
	margin:10px;
}

.sns li .last{
	float: left;
	width:174px;
}

nav ul .sp img{
	width:40px;
}

nav ul .sp a{
	display: inline;
}


/* ======= ハンバーガーメニュー ====== */
header{
	padding: 5px 0;
	border-bottom:1px solid #f3f3f3;
}
header .inner{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
h1{
	max-width: 250px;
	margin-right: auto;
	letter-spacing:-0.15em;
	padding-left:10px;
	text-align:left !important;
	font-size:65%;
}
@media all and (min-width:1000px){

}
nav{
	width:100%;
	font-family: "HG正楷書体-PRO","Lucida Grande","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro W3",Osaka,"メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",Geneva,Arial,Verdana,sans-serif !important;

}
header nav {
	margin-right: 5px;
}
header nav ul{
	max-width:1000px;
	display: flex;
	align-items: center;
	text-align:center;
	margin:0 auto;
}
header nav ul li a{
	text-decoration: none;
	font-weight: bold;
	padding: 12px 0;
	font-size:14px;
}

header nav ul li.sns a{
	text-decoration: none;
	font-weight: bold;
	padding: 5px 10px;
}

#main_img{
	max-width: 960px;
	margin: 0 auto;
}

#nav_toggle{
	display: none;
}
.change_btn{
	color: #fff;
	display: block;
	width: 100%;
	text-decoration: none;
	border: 1px solid #fff;
	text-align: center;
	padding: 25px 0;
	font-size:20px;
	margin-top: 40px;
}

/*スマホ・タブレット用の設定*/
@media screen and (max-width:960px){
	header{
		padding: 8px 0;
		position: relative;
	}
	.inner{
		width: 96%;
	}
	#main_img{
		width: 100%;
	}
	.change_btn{
		width: 90%;
		margin: 32px auto;
	}

	
	/*メニュー部分*/
	nav{
		display:none;
		position: absolute;
		top:0;
		width: 100%;
		height: 100vh;
		background:rgba(255,255,255,0.9);
		left: 0;
		z-index:99;
	}
	header nav ul{
		display: block;
		width: 90%;
		position: absolute;
		top: 30px;
		right: 0px;
		bottom: 0px;
		left: 0px;
		margin: auto;
	}
	header nav ul li{
		margin: 0 auto;
		text-align: center;
	}
	header nav ul li:last-child{
		border: none;
	}
	header nav ul li a{
		display: block; 
	}
	
	header nav ul li.sns a{
		display: inline-block; 
		color: #0168b7;
	}

	/*開閉ボタン*/
	#nav_toggle{
		display: block;
		width: 40px;
		height: 40px;
		position: relative;
		z-index: 100;
	}
	#nav_toggle div {
		position: relative;
	}
	#nav_toggle span{
		display: block;
		height: 3px;
		background: #0168b7;
		position:absolute;
		width: 100%;
		left: 0;
		-webkit-transition: 0.5s ease-in-out;
		-moz-transition: 0.5s ease-in-out;
		transition: 0.5s ease-in-out;	
	}
	#nav_toggle span:nth-child(1){
		top:0px;
	}
	#nav_toggle span:nth-child(2){
		top:12px;
	}
	#nav_toggle span:nth-child(3){
		top:24px;
	}
	
	/*開閉ボタンopen時*/
	.open #nav_toggle span{
		background: #0168b7;
	}
	.open #nav_toggle span:nth-child(1) {
			top: 12px;
		   -webkit-transform: rotate(135deg);
			-moz-transform: rotate(135deg);
			transform: rotate(135deg);
		}
		.open #nav_toggle span:nth-child(2) {
			width: 0;
			left: 50%;
		}
		.open #nav_toggle span:nth-child(3) {
			top: 12px;
			-webkit-transform: rotate(-135deg);
			-moz-transform: rotate(-135deg);
			transform: rotate(-135deg);
		}
}



.sp{
	display:inline;
}

.pc{
	display:none;
}

@media all and (min-width:768px){
.sp{
	display:none;
}

.pc{
	display:none;
}
}

@media screen and (min-width: 769px) and (max-width: 999px) {
.pc{
	display:inline;
}
}

@media all and (min-width:1000px){
.sp{
	display:none;
}

.pc{
	display:inline;
}
}


#container{
	width:100%;
	max-width:1100px;
	margin:0 auto;
	padding-top:30px;
}

#main{
	width:100%;
	float:left;
}

#side{
	width:100%;
	float:left;
}

@media all and (min-width:1000px){
#main{
	width:800px;
	float:left;
}

#side{
	width:250px;
	float:right;
	margin-left:50px;
}
}

.h15{
	height:15px;
}


.title{
	text-align:left;
	margin-top:10px;
	margin-left:20px;

}

.topic_r{
	padding:15px;
}

#main p.text{
	text-align:left;
	max-width:715px;
}

#news p{
	text-align:left;
	margin-left:30px;
}

.comment{
	text-align:left;
	margin-top:10px;
	margin-left:30px;
}

/* ========nav======== */
nav{	
	font-size: 130%;
	float: right;
	font-weight:bold;
}

nav li{
        display: inline;
        margin-right: 15px;
        
}

nav .last li{
        display: inline; 
}

nav a{
        color: #545454;
        text-decoration: none;
}

nav a:hover{
	color: #179a4c;
}

/* ========footer======== */
#footer{
	width:90%;
	background-color:#cdd4d5;
	color:#545454;
	margin:0 auto;
	padding:5%;
}

#footer_contents{
	max-width:1050px;
	margin:0 auto;
	text-align:center;
	position: relative;
	zoom: 1;
}

#footer #footerlogo{
	max-width:220px;
}


ul#footernavi li {
	display: inline;
	font-size: 92.4%;
}

ul#footernavi li a {
	color: #545454;
}

ul#footernavi li a:hover {
	color: #179a4c;
}


ul#footernavi li a:hover {
	text-decoration: underline;
}

ul#footernavi li.item_01 { position: absolute; top: 55px; left: 275px;}
ul#footernavi li.item_02 { position: absolute; top: 55px; left: 330px;}
ul#footernavi li.item_03 { position: absolute; top: 55px; left: 430px;}
ul#footernavi li.item_04 { position: absolute; top: 55px; left: 510px;}
ul#footernavi li.item_05 { position: absolute; top: 55px; left: 590px;}
ul#footernavi li.item_06 { position: absolute; top: 55px; left: 875px;}
ul#footernavi li.item_07 { position: absolute; top: 55px; left: 965px;}

#footer address#copyright {
	padding-top:15px;
	font-size: 70%;
	color: #545454;
	font-weight:bold;
	text-align:right;
}

/* ========other======== */


a:hover {
	filter:alpha(opacity=75);
	-moz-opacity:0.75;
	opacity:0.75;
}

#page-top {
	float:right;
	bottom:80px;
	margin-top:30px;
}



#formWrap {
	width:100%;
	margin:0 auto;
	color:#555;
}
table.formTable{
	width:100%;
	margin:0 auto;
	border-collapse:collapse;
}
table.formTable td,table.formTable th{
	border:1px solid #ccc;
	padding:10px 0;
}
table.formTable th{
	font-weight:bold;
	background:#efefef;
	text-align:center;
}
table.formTable tr{
}
table.formTable select {
	width:94%;
	height:35px;
	margin-left:3%;
	border:solid 1px #eeeeee;
	background:#ffffff;
}
table.formTable input {
	width:94%;
	height:35px;
	margin-left:3%;
	border:solid 1px #eeeeee;
	background:#eeeeee;
}
table.formTable input.checkbox {
	width:auto;
	height:35px;
	margin-left:2%;
	border:solid 1px #eeeeee;
	background:#eeeeee;
}
.checkbox{
	display: inline-block;
	vertical-align:bottom;
}
table.formTable textarea {
	width:94%;
	height:110px;
	margin-left:3%;
	border:solid 1px #eeeeee;
	background:#eeeeee;
}
.button {
  display       : inline-block;
  border-radius : 5%;          /* 角丸       */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 12px 39px;   /* 余白       */
  background    : #00b359;     /* 背景色     */
  color         : #ffffff;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  border        : 2px solid #00b359;    /* 枠の指定 */
}
.button:hover {
  color         : #00b359;     /* 背景色     */
  background    : #ffffff;     /* 文字色     */
}


/* ======= スライダー系メニュー ====== */

.swiper-pagination-bullet-active {
    opacity: 1;
    background: #000000;
}
.swiper-pagination-bullet{
    width:14px;
    height:14px;
}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next {
    background-image:none !important;
    left: 10px;
    right: auto;
}
.swiper-button-next, .swiper-container-rtl .swiper-button-prev {
    background-image:none !important;
    right: 10px;
    left: auto;
}


/* ======= bxslider ====== */
/*横1列でスライドさせる*/
#bxslider_carousel {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 15px 0;
}
@media all and (min-width:1000px){
#bxslider_carousel {
	width: 100%;
	height: 383px;
	margin: 0;
	padding: 15px 0;
}
}
.bx-wrapper {
    position: relative;
    margin: 0 !important;
    padding: 0;
    *zoom: 1;
}
.bx-wrapper .bx-viewport {
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    border: none !important;
    left: -5px;
    background: #fff;
}
#lightbox-container-image-box {
    position: relative;
    background-color: transparent !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 auto;
}
#jquery-overlay {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 90;
    width: 100% !important;
    height: 100% !important;
}
#lightbox-container-image-data-box {
    font: 10px Verdana, Helvetica, sans-serif;
    background-color: #fff;
    margin: 0 auto;
    line-height: 1.4em;
    overflow: auto;
    width: 100%;
    padding: 0 10px 0;
    display:none !important;
}



/* ======= usemap ====== */
	img[usemap] {
		border: none;
		height: auto;
		max-width: 100%;
		width: auto;
	}



/* ======= opening ====== */
#opening {
	opacity: 0;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #fff;
	animation: fadeOut 3.9s forwards;
	pointer-events: none;
}
#opening .logo {
	display: block;
	position: absolute;
	top: calc(50% - 40px);
	left: calc(50% - 76px);
	width: 152px;
	height: 80px;
	background: url(img/logo.png) no-repeat;
	animation: opening 2.4s forwards;
}

/* :::::: keyframes :::::: */
@keyframes opening {
	0%, 100% { opacity: 0; transform: scale(1.2); }
	40%, 80% { opacity: 1; transform: none; }
}


/* ========footer======== */
#item-list {
  padding:0;
}
#item-list ul{
  display: flex;
flex-wrap: wrap;
width: 100%;
}
#item-list ul li {
  list-style-type:none;
  float:left;
  padding-left:0;
}



ul.cols-1 li {width: 100%;}
ul.cols-2 li {width: 50%;}
ul.cols-3 li {width: 33.33333%;}
ul.cols-4 li {width: 25%;}
ul.cols-5 li {width: 20%;}
ul.cols-6 li {width: 16.66666%;}
ul.cols-7 li {width: 14.28571%;}
ul.cols-8 li {width: 12.5%;}

@media all and (min-width:1000px){
ul.cols-2 #footernavi li { 
      width:50%;
	text-align:left;
}
#footer_contents ul.cols-2 li:nth-child(2){ 
      width:50% !important;
	text-align:left;
}
.service ul.cols-2 li { 
      width:50% !important;
	text-align:left;
}
}

p.mail { 
	text-align:left;
	padding:15px 0;
}

ul.cols-2 #footernavi li { 
      width:100%;
	text-align:left;
}
#footer_contents ul.cols-2 li:nth-child(2){ 
      width:100%;
	text-align:left;
}
.service ul.cols-2 li { 
      width:100%;
	text-align:left;
}


@media only screen and (max-width: 767px) {
  ul.cols-4 li,ul.cols-5 li,ul.cols-6 li,ul.cols-7 li,ul.cols-8 li{
      width: 50%;
  }
  ul.cols-3 li{
      width:50%;
  }
  ul.cols-2 li{
      width:50%;
  }
}


.profile  th { width:40%;    font-weight: 500;padding:20px 0 !important; }
.profile  td { width:60%;}

/*----------------------------------------------------
  table
----------------------------------------------------*/
.profile th  { width: 30%; text-align: left; }
 
@media only screen and (max-width:480px){
    .profile { margin: 0; }
    .profile th,
    .profile td{
    width: 96%;
    display: block;
    border-top: none;
    }

.profile  th { padding:20px 0 !important;border-bottom:solid 1px #eeeeee; }
}

table, th, td {
    border: none;
}


/*複数段でスライドさせる*/
#wrapper_red {
	width: 240px; /*サムネイル画像の幅×横に並べる数＋画像間のmargin分*/
	margin: 0 auto;
	border: 5px solid #C30;
	padding: 20px 60px 0;
}
#wrapper_red li {
	float: left;
	margin: 10px;
}

/*横1列でスライドさせる*/
#wrapper_green {
	width: 430px;
	height: 100px;
	margin: 0 auto 100px;
	border: 5px solid #090;
	padding: 15px 60px 20px;
}


h3{
	font-weight:bold;
	text-align:center;
	padding: 0.5em 0;/*上下の余白*/
	margin:20px 0;
	border-top: solid 3px #eeeeee;/*上線*/
	border-bottom: solid 3px #eeeeee;/*下線*/
}

.text-body b {
    color: #010203;
    font-size: 1.00em;
    font-weight: bold;
    margin: 0px 0px;
    background: #ffa;
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fff), color-stop(60%, #fff), color-stop(60%, #ffa), color-stop(100%, #ffa));
    background-image: -webkit-linear-gradient(#fff, #fff 60%, #ffa 60%, #ffa);
    background-image: -moz-linear-gradient(#fff, #fff 60%, #ffa 60%, #ffa);
    background-image: -o-linear-gradient(#fff, #fff 60%, #ffa 60%, #ffa);
    background-image: linear-gradient(#ffffff,#ffffff 60%,#ffffaa 60%,#ffffaa);
}

strong{
	font-weight:bold;
	font-size:1.5em;
}

.btn:before,
.btn:after {
  -webkit-box-sizing: inherit;
  box-sizing: inherit;
}
.btn,
a.btn,
button.btn {
  font-size: 1.0rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1rem 2.5rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
  border-radius: 0.5rem;
  margin:0 2%;
}

a.btn-flat {
  overflow: hidden;

  padding: 1.5rem 3rem;

  color: #fff;
  border-radius: 0;
  background: #179a4c;
}

a.btn-flat span {
  position: relative;
}

a.btn-flat:before {
  position: absolute;
  top: 0;
  left: 0;

  width: 150%;
  height: 500%;

  content: "";
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  -webkit-transform: translateX(-98%) translateY(-25%) rotate(45deg);
  transform: translateX(-98%) translateY(-25%) rotate(45deg);

  background: #3ebd72;
}

a.btn-flat:hover:before {
  -webkit-transform: translateX(-9%) translateY(-25%) rotate(45deg);
  transform: translateX(-9%) translateY(-25%) rotate(45deg);
}

.link_catch{
	color:#eb5845;
	font-weight:800 !important;
}
.link_catch_bottom{
	font-size:14px !important;
	letter-spacing:-1px;
}