/*
Theme Name:with-a-smile
Theme URI:https://wsc.studiobrain.net/
Version:1.0
Author:StudioBRAIN
Author URI:https://www.studiobrain.net/
License:GNU General Public License v2.0
License URI:https://www.gnu.org/licenses/gpl-2.0.html
*/

/*!
 * Bootstrap v3.3.5 (https://getbootstrap.com)
 * Copyright 2011-2016 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */

/*!
 * Generated using the Bootstrap Customizer (https://getbootstrap.com/customize/?id=f8d72fc0ac7f2da00cef9b0eec9157af)
 * Config saved to config.json and https://gist.github.com/f8d72fc0ac7f2da00cef9b0eec9157af
 *//*!
 * Bootstrap v3.3.6 (https://getbootstrap.com)
 * Copyright 2011-2015 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 *//*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */html {
	font-family: sans-serif;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%
 }
@media screen and (min-width: 641px) {
	html,body {
    
    min-width: 1184px;
}
	
}

 @media screen and (max-width:640px) {
	html,body {
    
    min-width: 100%;
		width: 100%
			
}
	
	 .sp_none {
	display:none;
	
	}
.pc_none {
	display:block;
	
	}	
	
.f_l {
    float: none;
}

.f_r {
    float: none;
}

.entry-title {margin-bottom: 20px; font-size: 5vw;}



/* ==========================================================

	全ページ共通　各id

========================================================== */
body {
    font-size: 95%;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
	min-width: auto;
}
img {
	max-width:100%;
}
.wrapper {
	margin-right: auto;
	margin-left: auto;
	padding-right: 2%;
	padding-left: 2%;
	width: 96%;
	overflow:hidden;
}

.wrap {
      text-align: left;
    clear: both;
    margin-right: auto;
    margin-left: auto;
    /* padding-right: 2%; */
    /* padding-left: 2%; */
    width: 96%;
    box-sizing: border-box;
    overflow: hidden;
}



/*　header　*/

.header_inner {
    width: 98%;
    height: auto;
    margin-left: auto;
    margin-right: auto;
}

.header_content {
    height: 87px;
    /* display: inline; */
    border-top: 6px solid #1a6600;
}

#fixed_header_spacer {
    width: 100%;
    height: 77px;
}

.header_lower h1 {
    font-size: 10px;
    margin-bottom: 0px;
    margin-top: 0;
}
.header_lower img.logo {
    margin: 0;
    width: 60%;
}

.header_lower {
    width: 30%;
}

.breadcrumbs {
    clear: both;
    padding: 15px 0;
    font-size: 11px;
    line-height: 1.4;
}

/*メインイメージ*/

.main_img img {
    max-width: 100% !important;
    margin-top: 10px;
}



/*contents*/


.inner-main-title {
    width: 50%;
    height: auto;
    margin: 0 auto;
}

.box-main-title {
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    padding: 0;
}

.inner-1 {
    width: 100%;
    overflow: hidden;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
}

.box-1 {
       width: 100%;
    height: auto;
    font-size: 0;
    display: block;
    margin-left: 0;
    margin-right: 0;
    margin-top: 16px;
    text-align: center;
    margin: 5vw auto;
    float: none;
}
	a.box-title1:hover {
    outline: none;
} 

.box-title1 {
    display: block;
    height: auto;
    margin-left: auto;
    margin-right: auto;
}

.inner-2 ul{ margin:0;

}

.inner-2 ul li {
    display: inline-block;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    vertical-align: text-top;
    margin-top: 20px;
    border: 1px solid #ccc;
    padding: 2%;
}

.inner-2 {
    margin-top: 0px;
    text-align: center;
    margin-bottom: 0;
}

.bg_image2 {
background: none;
    height: auto;
    min-width: 0;
    margin: 0;
    position: relative;
}

.bg_image_inner .btn_img {
    width: 100%;
    margin: 0 auto;
    top: 0px;
}

.inner-3 {
      width: 100%;
      min-width: 100%;
      margin-left: auto;
      margin-right: auto;
      overflow: hidden;
      margin-top: 0;
      margin-bottom: 0;
}

.box-2 {
       width: 100%;
    height: auto;
    float: none;
    margin-left: 0;
    margin-right: 0;
    margin-top: 3em;
    text-align: center;
}
.box-title2:hover {
    outline: none;
}
.box-title2 {
    display: block;
    width: 100%;
    height: auto;
}

.content-2 {
    min-width: 100%;
    overflow: hidden;
    margin-bottom: 10px;
}

.inner-3-2 {
    width: 100%;
    min-width: 100%;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    margin-bottom: 20px;
}

.box-3 {
    width: 90%;
    float: none;
    margin-left: 0;
    margin-right: 0;
    margin: 0 auto;
    margin-top: 16px;
	text-align: center;
}

.content-3 {
    width: 40%;
    margin: 0 auto;
    float: right;
}

.inner-2 .sp_img{width:50%;margin:0 auto;margin-bottom:20px;margin-top: 10px;}

.inner-2 ul p {
    font-size: 15px;
    margin-bottom: 10px;
}

.bg_image_inner {
    margin: 0 auto 0;
    margin-top: 0;
    width: 65%;
    display: block;
    position: absolute;
    bottom: 20%;
    left: 0;
    right: 0;
}
	 
.page h3 {
    font-size: 16px;
    border-left: 3px solid #1a6600;
    padding-left: 10px;
    border-bottom: 1px solid #1a6600;
    padding-bottom: 5px;
    margin-top: 15px;
}

/*フッター*/

.footer_link {
    margin: 2em auto;
    background-color: #fff;
    text-align: left;
    padding: 0 0 0 0;
    width: 100%;
}

.footer_link li {
    color: #fff;
    font-size: 15px;
    border-bottom: 1px solid #dcdcdc;
    padding: 1% 0;
}


.footer_link a {
      text-decoration: none;
    color: #333;
    display: block;
    background: url(/wp-content/themes/with-a-smile/img/footer/sp_listmark_arrow.png) no-repeat right center;
    background-repeat: no-repeat;
    background-size: 5vw;
    padding: 1.5vw 0;
}


.content-4 {
    min-width: 100%;
    margin-bottom: 20px;
	margin-bottom: 80px;
}

.inner-4 {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
	height: auto;
}

.address {
    float: none;
    margin: 0;
    text-align: center;
    padding: 0;
    margin-top: 1%;
    font-size: 11px;
    padding-bottom: 2%;
    color: #333;
    letter-spacing: 0.065em;
}


/*三つの特徴*/


.txt_box p {
    overflow: hidden;
    padding-left: 0;
    padding-top: 15px;
}

.txt_box2 p {
    overflow: hidden;
    padding-right: 0;
    padding-top: 15px;
}


/*カウンセリング事例*/

#counseling .case_list ul{ margin:0;}


#counseling .case_list ul li {
    width: 100%;
    margin-top: 15px;
    font-size: 12px;
}

/*システム・料金体制*/

#fee { margin-top: 30px;}

#fee .txt_box h4 {
    overflow: hidden;
    color: #333;
    padding-left: 0;
    padding-top: 15px;
}

#fee .txt_box2 h4 {
    overflow: hidden;
    color: #333;
    padding-left: 0;
    padding-top: 15px;
}

#fee table {
    width: 100%;
    margin: 0 auto;
    margin-bottom: 30px;
}


#fee table th {
    width: 20%;
    background-color: #1a6600;
    color: #fff;
    font-size: 11px;
    border: 1px solid #ccc;
    padding: 5px;
}

#fee table td {
    text-align: center;
    padding: 5px;
    border: 1px solid #ccc;
    white-space: initial;
    font-size: 11px;
}
	 
	 
.price_list h5 {
	font-size: 100%;
    margin-bottom: 30px;
    margin-top: 40px;
    border-left: 5px solid #1a6600;
    padding-left: 10px;
    line-height: 1.5;
}


/*お問合せ*/

input, textarea, select {
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    width: 100%;
	height: 40px;
}

#form table {
    display: block;
    width: 96%;
    margin: 0 auto;
    margin-top: 10%;
}

#form table th {
    width: 100%;
    margin-top: 6%;
    display: block;
}

#form table td {
    padding-top: 15px;
    width: 100%;
    display: block;
}

/*ご予約フォーム*/

.contact_area .raiten table tr th {
    background-color: #f8f8f8;
    padding: 20px 0px;
    text-align: center;
    width: 100%;
    display: block;
}

.contact_area .raiten table tr td {
    padding: 10px 30px;
    border-bottom: 1px solid #eee;
    text-align: left;
    width: 100%;
    display: block;
}

.contact_area table {
    width: 100%;
    margin: 0 auto;
}
input, button, textarea, select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
	 
.wrapArticle ul.articleArea li {
    box-sizing: border-box;
    width: 100%;
    display: inline-block;
    vertical-align: top;
    padding: 0 1em;
}	 
	 
	.wrapArticle {
    padding: 1em 0 0;
}
	 
.main_img {
    text-align: center;
    background-image: url(img/top/main_bg.jpg);
    background-repeat: no-repeat;
    position: relative;
    background-size: 200%;
    width: 100%;
    background-position: 35% 0;
}		
	 
/*TOPページお客様の声*
******************************************/

.voice_area h2 {
	text-align: center;
	margin-bottom: 30px;
}

.voice_area .box h3 {
	background-color: #44822F;
    width: 100%;
    margin: 0 auto;
    border: 3px solid #196600;
    font-size: 100%;
    margin-bottom: 20px;
}

.voice_area .box {
	overflow: hidden;
	margin-bottom: 20px;
}

.voice_area .box .img_area {
	float: none;
	padding-right: 0px;
	text-align: center;
	margin-bottom: 20px;
}	 
	 
.voice_area .box span {
	color: #D80000;
	font-size: 18px;
	font-weight: bold;
}
	 
.voice_area .box .img_area02 {
	float: none;
	padding-left: 0px;
	text-align: center;
	margin-bottom: 20px;
}
	 
	/*footer上コンタクトバナー*
******************************************/

.contact_bnr {
	width: 100%;
	margin: 0 auto;
	position: relative;
	margin-top: 20px;
	margin-bottom: 30px;
}

.contact_bnr .btn_area {
	position: absolute;
    left: 10px;
    bottom: -14px;
    width: 50%;
}
	 
	/*投稿ページ関連記事表示*
******************************************/


/* --------related---------- */
#related h3 {
  border-bottom: 1px dotted #ccc;
  padding-bottom: 2px;
  font-size: 18px;
  letter-spacing: 1px;
}
#related ul {
  padding-left: 0px;
}
#related li {
  list-style: none;
  border-bottom: 1px dotted #ddd;
  margin: 0 2% 20px 0;
  padding: 0 0 0px 0px;
  width: 100%;
  float: none;
}
#related .cat-thum {
  width: 80px;
}
#related img.wp-post-image {
  width: 80px;
  height: 80px;
  box-shadow: 0 0 0 2px #fff, 0 0 0 3px #ccc;
  margin-bottom: 10px;
}
#related h4 {
  font-size: 100%;
  margin: 0px;
}
	 
	 
/*カウンセリングの流れ*
******************************************/

.flow .box .left {
    width: 100%;
    float: none;
    margin-top: 60px;
}
	 
.flow .box .right {
    width: 100%;
    float: none;
    text-align: center;
    margin-top: 30px;
}
	 
.flow .box {
    overflow: hidden;
    background: #fbf8f1;
    padding: 20px;
    position: relative;
    margin-bottom: 33px;
    padding-bottom: 55px;
}
	 
	 
.flow .box h4 {
    color: #57ae1d;
    font-size: 4vw;
    margin-bottom: 10px;
    line-height: 1.5;
}
	 
	 
/*スポーツ選手のカウンセリング*
******************************************/

.sports h4 {
    font-size: 4vw;
    background: #1a6600;
    padding: 1% 2%;
    line-height: 1.8;
    color: #fff;
}
	
.sports p.tit {
	border-bottom: 3px solid #1a6600;
    font-weight: bold;
}
 
/*ラベル*/
.box-counseling label {
    display: block;
    margin: 1.5px 0;
    color: #fff;
    font-weight: bold;
    background: none;
    cursor: pointer;
    transition: all 0.5s;
}

/*ラベルホバー時*/
.box-counseling label:hover {
    background :none;
}

/*チェックは隠す*/
.box-counseling input {
    display: none!important;
}

/*中身を非表示にしておく*/
.box-counseling .accshow {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.8s;
}

/*クリックで中身表示*/
.cssacc:checked + .accshow {
    height: auto;
    opacity: 1;
}


/*アイコンを表示*/
.box-counseling label:before {
    content: '\f054';
    font-family: 'FontAwesome';
    padding-right: 8px;
}

/*アイコンを入れ替える*/
.cssacc:checked + label:before {
    content: '\f078';
}	 
	 
	 
	 
	 
	 
	 
	 
	 
	 
	 
	 
	 
	 
/*フッター*
******************************************/	 
	 .btnArea {
    float: none;
    width: 100%;
    background-color: #196500;
    position: fixed;
    bottom: 0;
    left: 0;
    border-top: 1px solid #FFF;
    z-index: 9999;
    box-sizing: border-box;
}
	 
	 
.btnArea ul {
    letter-spacing: -.4em;
}
	 
.btnArea .bottomBtn a {
    color: #fff;
    width: 100%;
    height: 100%;
    display: block;
    padding: 13vw 0 0;
    font-size: 3vw;
    text-decoration: none;
}
	 
.btnArea a span {
    text-align: center;
    display: block;
    text-decoration: none;
}
	 
.btnArea ul li {
    letter-spacing: normal;
    position: relative;
    float: left;
}	 

.btnArea ul li::after {
    content: "";
    width: 1px;
    display: block;
    background-color: #fff;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
}
	 
.btnArea .bottomBtn {
    width: 33%;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
}

	 
.btnArea .bottomBtn.mail {
    background: url(img/bottom_mail_sp.png) no-repeat;
    background-position: center 3.5vw;
    background-size: 30%;
}
	 
.btnArea .bottomBtn.showroom {
    background: url(img/bottom_showroom_sp.png) no-repeat;
    background-position: center 2vw;
    background-size: 30%;
}
	 
.btnArea .bottomBtn.tel {
    background: url(img/bottom_tel_sp.png) no-repeat;
    background-position: center 2.5vw;
    background-size: 30%;
}
	 
	 
/*TOPページスポーツカウンセリングバナー*
******************************************/	 
.sport_bnr {
    text-align: center;
    margin-top: 2em;
}	 
	 
	 
	 
	 
	 
	 
	 
	 
	 
	 
	 
	 
	 
	 
	 
	 
	 
	 
	 
	 
	 
	 
}