@charset "UTF-8";
/*
Theme Name: kanoyadenshi
*/
body {
	font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
	font: 100%/1.4;
	font-size : 14px;
	font-size : 0.9rem;
	margin: 0;
	padding: 0;
	color: #666;
}
/**
reset **/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}

/*============
nav
=============*/
#navArea{
	display : none;
}
nav {
  display: block;
  position: fixed;
  top: 0;
  left: -300px;
  bottom: 0;
  width: 300px;
  background: #ffffff;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  transition: all .5s;
  z-index: 100;
  opacity: 0;
}
.open nav {
  left: 0;
  opacity: 1;
}
nav .inner {
  padding: 25px;
}
nav .inner ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
nav .inner ul li {
  position: relative;
  margin: 0;
  border-bottom: 1px solid #333;
}
nav .inner ul li a {
  display: block;
  color: #333;
  font-size: 14px;
  padding: 1em;
  text-decoration: none;
  transition-duration: 0.2s;
}
nav .inner ul li a:hover {
  background: #e4e4e4;
}
@media screen and (max-width: 767px) {
  nav {
    left: -220px;
    width: 220px;
  }
}
/*============
.toggle_btn
=============*/
.toggle_btn {
  display: block;
  position: fixed;
  top: 4%;
  right: 8%;
  width: 30px;
  height: 30px;
  transition: all .5s;
  cursor: pointer;
  z-index: 99;
}
.toggle_btn span {
  display: block;
  position: absolute;
  left: 0;
  width: 30px;
  height: 2px;
  background-color: #333;
  border-radius: 4px;
  transition: all .5s;
}
.toggle_btn span:nth-child(1) {
  top: 4px;
}
.toggle_btn span:nth-child(2) {
  top: 14px;
}
.toggle_btn span:nth-child(3) {
  bottom: 4px;
}
.open .toggle_btn span {
  background-color: #fff;
}
.open .toggle_btn span:nth-child(1) {
  -webkit-transform: translateY(10px) rotate(-315deg);
  transform: translateY(10px) rotate(-315deg);
}
.open .toggle_btn span:nth-child(2) {
  opacity: 0;
}
.open .toggle_btn span:nth-child(3) {
  -webkit-transform: translateY(-10px) rotate(315deg);
  transform: translateY(-10px) rotate(315deg);
}
/*============
#mask
=============*/
#mask {
  display: none;
  transition: all .5s;
}
.open #mask {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: .8;
  z-index: 99;
  cursor: pointer;
}

/*============
ボタン
=============*/

a.button{
	margin : 9% auto 9%;
	padding : 30px;
	width : 30%;
  display: inline-block;
  text-align: center;
  
  text-decoration: none;
  outline: none;
	font-size : 1.4rem;
	font-weight : bold;

}
.button::before,
.button::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.button,
.button::before,
.button::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.button {
  position: relative;
  z-index: 2;
  background-color: #fff;
  border: 2px solid #333;
  color: #000;
  overflow: hidden;
}
.button:hover {
  color: #fff;
  border-color: #2784D1!important;

}
.button::after {
  top: 0;
  left : -100%;
  width: 100%;
  height: 100%;
}
.button:hover::after {
  top: 0;
  left : 0;
  background-color: #2784D1;
}



/**
Common
************************************************************************************************************* **/
.fadeImg{
-webkit-transition: opacity 0.3s ease-out;
-moz-transition: opacity 0.3s ease-out;
-ms-transition: opacity 0.3s ease-out;
transition: opacity 0.3s ease-out;
}
.fadeImg:hover {
opacity: .7;
-webkit-opacity: .7;
-moz-opacity: .7;
filter: alpha(opacity=70);	/* IE lt 8 */
-ms-filter: "alpha(opacity=50)"; /* IE 8 */
-webkit-transition: opacity 0.3s ease-out;
-moz-transition: opacity 0.3s ease-out;
-ms-transition: opacity 0.3s ease-out;
transition: opacity 0.3s ease-out;
}
a img { border: none;}
a {outline: none;}
a:link {color:#707070;text-decoration:none;}
a:visited {color: #707070;text-decoration:none;}
a:hover, a:active, a:focus {text-decoration: none;}
.clearfloat { clear:both;height:0;font-size: 1px;line-height: 0px;}
.selector { font-feature-settings: "palt";}


/**
animation ********************************/
.fadeInUp{
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:1.5s;
 -ms-animation-duration:1.5s;
 animation-duration:1.5s;
 -webkit-animation-name: fadeInUp;
 animation-name: fadeInUp;
 visibility: visible !important;
}


/**
Index 
************************************************************************************************************* **/
.headerNav{
	width : 100%;
	position : fixed;
	z-index : 5;
	background-color : #fff;
	overflow:hidden;
}
.contentWrapper{
	padding-top : 8%;
}
.headerLogo{
	width : 20%;
	float : left;
	padding : 1% 0 0 8%;
}

.headerLogo img{
	width : 100%;
}
#topNav{
	width : 40%;
	margin-right : 8%;
	float : right ;
}
ul.gNav{
	width : 100%;
	font-size : 0;
}
ul.gNav li{
	display:inline-block;
	text-align : center;
	width : 14.5%;
	padding : 7% 0 0;
	margin : 0 1%;
	vertical-align:middle;
	font-size : 0.9rem;
	font-weight : bold;
}
.swiper-container {
      width : 100% ;
}
.swiper-slide img{
	width : 100%;
}
.swiperText{
	font-size : 3.5rem;
	position : absolute;
	font-weight : bold;
	width : 100%;
	text-align : center;
	top : 55%;
	left : 0;
	color : #fff;
	z-index:5;
}
.pcdn{
	display : none;
}
.topBanner{
	width : 100%;
	margin-top : 5%;
}
.topBanner img{
	float : left;
	width : 40%;
	margin  :0 5%;
}

.footer{
	background-color:#2784D0;
	color : #fff;
}
.spftMap{
	display : none;
}
.footer img{
	width : 50%;
	float : left;
}
.footerInfo{
	width : 48%;
	margin-left : 2%;
	float : left;
	padding-top : 3%;
	font-size : 0.7rem;
}
.footerInfo p{
	line-height : 1.8;
}
.companyName{
	font-size : 1.2rem;
	letter-spacing:2px;
	margin-bottom : 3%;
}
.footerMap{
	width : 80%;
	margin-left : 2%;
	margin : 1.5% 0;
	overflow:hidden;
}
.footerMap img{
	width : 100%;
}
.credit{
	letter-spacing : 1.3px;
	font-size : 0.6rem !important;
}


/**
single page common
************************************************************************************************************* **/
.eyeCatch{
	width : 100%;
}
.eyeCatch img{
	width : 100%;
}
h2{
	color : #2784D0;
	font-size : 2.5rem;
	letter-spacing : 2px;
	font-weight : bold;
	margin : 15% 0 4%;
	text-align : center;
}
h3{
	color : #333;
	font-size : 1.4rem;
	letter-spacing : 2px;
	font-weight : bold;
	text-align : center;

}
p.bodyCopy{
	color : #8F8F8F;
	font-size : 1.3rem;
	letter-spacing:1.5px;
	line-height : 2;
	font-weight : bold;
	width : 50%;
	margin : 12% auto 2%;
}
	
/**
Occupation
************************************************************************************************************* **/
#occupationWrapper{
	margin-bottom : 20%;
}
.ocBlock{
	width : 100%;
	margin-top : 15%;
	text-align : center;
	overflow:hidden;
}
.ocTitle{
	width : 26%;
	margin : 0 37%;
}
.oc01 .ocTitle{
	width : 35%;
	margin : 0 32.5%;
}
.ocPhoto{
	padding-top : 5%;
	width : 75%;
	margin : 0 12.5%;
}
p.ocInfo{
	color : #666;
	font-size : 1.1rem;
	letter-spacing:1.2px;
	line-height : 2;
	width : 50%;
	margin : 3% auto 0;
	text-align: left;
}




/**
Recruit
************************************************************************************************************* **/
.wwy{
	width : 75%;
	margin : 4% 12.5%;
}
.interview{
	background-color:#D2ECFF;
	margin-top : 10%;
	letter-spacing:2px;
	line-height : 2;
	
}
.ivAb01{
	width : 8% !important;
	position : absolute;
	top : -5%;
	left : 90%;
	z-index : 2;
}
.ivAb02{
	width : 10% !important;
	position : absolute;
	top : 85%;
	left : -2%;
	z-index : 2;
}
.ivAb03{
	width : 12% !important;
	position : absolute;
	top : 85%;
	left : -2%;
	z-index : 2;
}
.interview h2{
	padding-top : 5%;
	margin-bottom : 2%;
}
.ivContents{
	width : 90%;
	margin  : 0 auto;
}
.ivSection01,.ivSection02{
	position : relative;
}
.ivLow01{
	width : 100%;
	margin : 10% 0 2%;
}
.ivLow01 img{
	float : right;
	width : 40%;
	padding:2% 4% 0 0;
}
.ivTitle{
	float : left !important;
	padding: 1% 0;
	margin-left : 3%;
	width : 40% !important;
}
.ivLow01 p{
	width : 35%;
	float : left;
	padding :2% 0 0 10%;
}
.ivLow02{
	width : 100%;
	padding-bottom : 5%;
}
.ivLow02 img{
	width : 43%;
	float : left;
	padding : 0 2.5%;
	z-index : 3;
}
.ivLow02 p{
	width : 35%;
	float : left;
	padding-left : 8%;
}
.nextInterview{
	width : 100%;
	margin-top : 5%;
	padding-top : 2%;
	background-color:#FFEBEB !important;
}

.recruitInfo{
	margin : 5% auto;
}
.recruitInfo table{
	width : 60%;
	margin : 0 auto;
	 border-collapse: separate;
  	border-spacing: 5px;
}

.recruitInfo table tr th{
	width : 20%;
	text-align : center;
	padding : 1.5% 0;
	line-height : 1.8;
	vertical-align:middle;
	background-color : rgba(229,236,242,1);
	font-weight : bold;
	color : #666;
}
.recruitInfo table tr td{
	width : 78%;
	text-align : left;
	padding : 1.5% 0 1.5% 2%;
	line-height : 1.8;
	background-color : rgba(204,204,204,0.1);
}
.buttonCover{
	width: 100%;
	text-align : center;
}
.toMynavi{
	width : 30%;
	margin : 1% 35%;
}




/**
About
************************************************************************************************************* **/
.message{
	width : 80%;
	margin : 0 auto;
	background-image:url(images/president03.jpg);
	background-repeat:no-repeat;
	background-size:90%;
	background-position: bottom left;
}
.message p{
	width : 60%;
	margin-left : 40%;
	line-height:1.8;
	letter-spacing:1.5;
	padding:3% 0;
}
.message img{
	width : 23%;
	padding: 0 0 10% 77%;
}
.companyInfo{
	background-color :#F5F5F5;
	width : 100%;
	margin-top : 15%;
	padding : 1% 0 5%;
}
.companyInfo table{
	width : 70%;
	margin : 0 auto;
  	border-collapse: separate;
  	border-spacing: 5px;
}
.companyInfo table tr th{
	width : 20%;
	text-align : center;
	padding : 4% 0;
	line-height : 1.8;
	vertical-align:middle;
	background-color : rgba(229,236,242,1);
	font-weight : bold;
	color : #666;
}
.companyInfo table tr td{
	width : 78%;
	text-align : left;
	padding : 4% 0 4% 2%;
	line-height : 1.8;
	background-color : rgba(255,255,255,0.8);
}
.factories h2{
	margin-bottom : 10%;
}

.fac_Wrapper{
	width : 80%;
	margin : 0 auto 8%;
}
.facBlock{
	width : 31%;
	margin : 1% 1%;
	float : left;
	background-color : #EEF5FB;
}
.facBlock img{
	width : 88%;
	padding : 0 6%;
}
.facMap{
	width : 88%;
	margin : 4% 6%;
}
.facBlock p{
	padding : 4% 6%;
	line-height : 1.6;
}
	
/**　phpの調整でくわえたもの **/
.articleWrapper{
	width : 80%;
	margin : 0 auto !important;
}
.articleWrapper img{
	width : 100% ;
	height : auto;
}
.articleWrapper p{
	letter-spacing : 1.5;
	line-height : 1.6;
	padding : 2% 0;
}
h2.articleTitle{
	width : 100%;
	text-align : left !important;
	font-size : 2.5rem !important;
	color : #999 !important;
}

.topInformation{
	width : 80%;
	margin : 15% auto;
}
p.infoTitle{
	width : 98.5%;
	padding-left : 1.5%;
	margin-bottom : 5%;
	font-color : #6D6C6C !important;
	font-size : 2rem !important;
	text-align  : left !important;
	font-weight : bold;
	letter-spacing:2px;
}
.postBlock{
	width : 30%;
	padding : 0 1.5%;
	float : left ;
	margin-bottom : 10%;
}
.thum{
	width: 100%;
}
.thum img {
	width : 100%;
	height : auto;
}
p.postDate{
	padding : 3% 0;
}

h2.postTitle{
	width : 100%;
	margin : 0 auto !important;
	text-align : left !important;
	font-size : 1rem !important;
	font-weight:inherit;
}
p.pastpost{
	width : 20%;
	margin : 5% auto 10%;
	padding : 1.8% 2%;
	text-align : center;
	border : 1px solid #333;
	font-size : 1.2rem;
	font-weight : bold;
	letter-spacing:2px;
}

/** ===========
Past Post
============**/
.ppWrapper {
	width : 80%;
	margin : 0 auto;
}
.ppWrapper .postBlock{
	width : 100%;
}
.ppWrapper .postBlock img{
	width : 30%;
	float: left;
	padding-right : 5%;
}
.ppInfo{
	width : 60%;
	float : left;
}
.ppInfo h2.postTitle{
	font-size : 1.5rem !important;
	font-weight : bold;
	padding-bottom : 2%;
}
.ppInfo p{
	letter-spacing:1.5 !important;
	line-height:1.8 !important;
}
.ppWrapper hr{
	border : 1px dotted #666;
	margin : 3% 0;
	width : 100%;
}



/** ==================
entry 
================ **/

.entryWrapper{
	text-align : center ;
}
.entryInfo{
	margin : 3% 0;
	letter-spacing : 1.5;
	line-height:2;
}
.wpcf7-form{
	text-align : left !important;
	width : 60%;
	margin : 0 auto 15%;
}

.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="url"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="date"],
.wpcf7 textarea {
	background-color: #fff;
	color: #333;
	width: 95%;
	border: 1px solid #ddd;
	font-size: 100%;
	padding: 0.5em;
	margin : 1% 0 2%;
	border-radius: 4px;
	box-shadow: 1px 1px 3px rgba(0,0,0,.1) inset;
}
.wpcf7 .gen{
	line-height : 3;
}
.wpcf7 input[type="submit"] {
	font-size: 1.2rem;
	padding: 2% 15%;
	margin : 5% 0 0;
	color: #333;
	border-radius: 4px;
	cursor: pointer;
	box-shadow: 0 0 1px rgba(0,0,0,.2);
	border: 1px solid #ccc;
	text-shadow: -1px 1px 0 rgba(255,255,255,1);
}

@media screen and (min-width : 1919px) {
}

@media screen and (min-width : 1660px) {

}

@media screen and (min-width : 1440px) {
}

@media screen and (min-width : 1240px) {

}

@media screen and (min-width : 1150px) {
	}

@media screen and (max-width : 960px) {
.contentWrapper{
	padding-top : 11%;
}
.headerLogo{
	width : 25%;
	float : left;
	padding : 1% 0 0 4%;
}
#topNav{
	width : 40%;
	margin-right : 4%;
	float : right ;
}
ul.gNav li{
	padding : 10.5% 0 0;
}
.swiperText{
	font-size : 2.7rem;
}
.fac_Wrapper{
	width : 90%;
	margin : 0 auto 5%;
}
	
.message{
	width : 100%;
	margin : 0 auto;
	background-image:url(images/president03.jpg);
	background-repeat:no-repeat;
	background-size:100%;
	background-position: bottom left;
}
.message p{
	margin-left : 35%;
	padding:3% 0;
}
.message img{
	width : 23%;
	padding: 0 0 10% 70%;
}
	
p.bodyCopy{
	font-size : 1.3rem;
	letter-spacing:1.5px;
	line-height : 2;
	width : 60%;
}	
p.ocInfo{
	font-size : 1.1rem;
	letter-spacing:1.2px;
	line-height : 2;
	width : 60%;
	margin : 3% auto 0;
}
	

.interview h2{
	padding-top : 5%;
	margin-bottom : 2%;
}
.ivContents{
	width : 80%;
}
.ivLow01{
	width : 100%;
	margin : 10% 0 2%;
}
.ivLow01 img{
	float : none;
	width : 100%;
}
.ivTitle{
	float : none !important;
	padding: 1% 0;
	width : 100% !important;
	margin-left : 0;
}
.ivLow01 p{
	width : 100%;
	float : none;
	padding :2% 0 10%;
}
.ivLow02{
	width : 100%;
}
.ivLow02 img{
	width : 100%;
	float : none;
	padding : 0 0;
}
.ivLow02 p{
	width : 100%;
	float : none;
	padding-left : 0;
	padding-top : 4%;
}

.nextInterview{
	width : 100%;
	margin-top : 5%;
	padding-top : 2%;
	background-color:#FFEBEB !important;
}
.ivAb01{
	width : 18% !important;
	top : 7%;
	left : 90%;
	z-index : 2;
	opacity:0.3;
}
.ivAb02{
	width : 20% !important;
	top : 78%;
	left : -8%;
	opacity:0.3;
}
.ivAb03{
	width : 17% !important;
	top : 80%;
	left : -8%;
	opacity : 0.3;
	}

.recruitInfo table{
	width : 80%;
}


	
	
	
}

@media screen and (max-width : 850px) {
}
@media(min-width: 768px){
  a[href^="tel:"]{    pointer-events: none;  } 
}
@media screen and (max-width : 768px) {
.spdn{
	display : none;
}
.headerLogo{
	width : 28%;
	padding : 1% 0 0 4%;
}
#topNav{
	width : 50%;
}
.contentWrapper{
	padding-top : 12%;
}
ul.gNav li{
	padding : 9% 0 0;
}
.swiperText{
	font-size : 2.3rem;
	top : 45%;
	left : 0;
	color : #fff;
	z-index:5;
}
.facBlock{
	width : 45%;
	margin : 3% 2%;
}

.companyInfo table{
	width : 80%;
}
.companyInfo table tr th{
	width : 30%;
}
.companyInfo table tr td{
	width : 68%;
}



/**
PHP part ******************************** **/
.topInformation{
	width : 95%;
	margin : 15% auto;
}
p.infoTitle{
	width : 98.5%;
	padding-left : 1.5%;
	margin-bottom : 5%;
	font-color : #6D6C6C !important;
	font-size : 2rem !important;
	text-align  : left !important;
	font-weight : bold;
	letter-spacing:2px;
}
.postBlock{
	width : 30%;
	padding : 0 1.5%;
	float : left ;
}
.thum{
	width: 100%;
}
.thum img {
	width : 100%;
	height : auto;
}
p.postDate{
	padding : 3% 0;
}

h2.postTitle{
	width : 100%;
	margin : 0 auto !important;
	text-align : left !important;
	font-size : 1rem !important;
	font-weight:inherit;
}
p.pastpost{
	width : 40%;
	margin : 5% auto 10%;
	padding : 1.8% 2%;
	text-align : center;
	border : 1px solid #333;
	font-size : 1.2rem;
	font-weight : bold;
	letter-spacing:2px;
}
.recruitInfo table{
	width : 85%;
	font-size : 0.9rem;
}
.recruitInfo table tr th{
	width : 30%;
}
.recruitInfo table tr td{
	width : 68%;
}

a.button{
	width : 60%;
	font-size : 1.4rem;
}
.wpcf7-form{
	width : 70%;
}


}
@media screen and (max-width : 600px) {
.contentWrapper{
	padding-top : 20%;
}
.headerLogo{
	width : 45%;
	padding : 3% 0 2% 4%;
}
.toggle_btn {
  top: 6%;
}
#topNav {
	display : none;
}
#navArea{
	display : inherit;
}
.header{
	position : relative;
}
.swiperText{
	font-size : 1.7rem;
}
.topBanner{
	width : 100%;
	margin-top : 5%;
}
.topBanner img{
	float : none;
	width : 80%;
	margin  :5% 10%;
}
.footerPhoto{
	display : none;
}
.spftMap{
	display : inherit;
	width : 100%;
}
.footer img{
	display : none;
}
.footerInfo{
	width : 97%;
	margin-left : 0;
	float : none;
	padding-top : 5%;
	padding-bottom : 5%;
	padding-left : 3%;
}
	
.message{
	background-image:url(images/president_sp.jpg);
}
.message p{
	margin-left : 35%;
	padding:3% 0;
}
.message img{
	width : 33%;
	padding: 0 0 10% 62%;
}

#occupationWrapper{
	margin-top : 20%;
}
p.bodyCopy{
	font-size : 1.2rem;
	letter-spacing:1.5px;
	line-height : 2;
	width : 75%;
}	
p.ocInfo{
	font-size : 1rem;
	width : 82%;
}
.ocTitle{
	width : 35%;
	margin : 0 32.5%;
}
.oc01 .ocTitle{
	width : 53%;
	margin : 0 23.5%;
}
.ocPhoto{
	padding-top : 6%;
	width : 82%;
	margin : 0 9%;
}
.wwy{
	width : 100%;
	margin : 5% 0;
}
.companyInfo table{
	width : 90%;
}
.companyInfo table tr th{
	font-size : 0.9rem;
}
.companyInfo table tr td{
	font-size : 0.9rem;
}

/**
PHP part ******************************** **/
.topInformation{
	width : 95%;
	margin : 15% auto;
}
p.infoTitle{
	width : 90%;
	padding-left : 10%;
	font-size : 2rem !important;
}
.postBlock{
	width : 80%;
	padding : 5% 10%;
	float : none ;
}
p.pastpost{
	width : 60%;
	margin : 5% auto 10%;
	padding : 3%;
	font-size : 1.2rem;
}
.recruitInfo table{
	width : 95%;
	font-size : 0.8rem;
}
.recruitInfo table tr th{
	padding : 2.5% 0;
}
.recruitInfo table tr td{
	padding : 2.5% 0 2.5% 2%;
}

a.button{
	width : 80%;
	font-size : 1.4rem;
}

.toMynavi{
	width : 50%;
	margin : 1% 25%;
}

.ppWrapper {
	width : 80%;
	margin : 0 auto;
}
.ppWrapper .postBlock{
	padding : 0 ;
}
.ppWrapper .postBlock img{
	width : 100%;
	float: none;
	padding-right : 0;
	padding-bottom : 1%;
}
.ppInfo{
	width : 100%;
	float : none;
	margin : 2% auto 0;
}
.ppInfo h2.postTitle{
	padding-bottom : 2%;
}
.ppWrapper hr{
	margin : 5% 0 8%;
}



}
@media screen and (max-width : 500px) {
.toggle_btn {
  top: 5%;
  z-index: 10;
}
.swiperText{
	font-size : 1.7rem;
	text-align : left;
	line-height : 1.5;
	top : 13%;
	left : 5%;
}
.message{
	background-image:url(images/presidentSP2.jpg);
}
.message p{
	background-color : rgba(255,255,255,0.2);
	padding : 2%;
}


.pcdn{
	display : inherit;
}

.facBlock{
	width :80%;
	float : none;
	margin : 5% auto 3%;
}
.ppInfo h2.postTitle{
	font-size : 1.3rem !important;
}
.ppInfo p{
	letter-spacing:1.4 !important;
	line-height:1.5 !important;
}
.wpcf7-form{
	width : 80%;
}
}
@media screen and (max-width : 450px) {
.toggle_btn {
  top: 4%;
}
.swiperText{
	font-size : 1.6rem;
	text-align : left;
	line-height : 1.5;
	top : 11%;
}
}

@media screen and (max-width : 400px) {
.toggle_btn {
  top: 3%;
}
.swiperText{
	font-size : 1.4rem;
	text-align : left;
	line-height : 1.5;
	top : 10%;
	left : 5%;
}
}