/*
Theme Name: mytheme
Theme URI: https://wordpress.org/themes/twentyfifteen
Author: the WordPress team
Author URI: https://wordpress.org/
Description: Our 2015 default theme is clean, blog-focused, and designed for clarity. Twenty Fifteen's simple, straightforward typography is readable on a wide variety of screen sizes, and suitable for multiple languages. We designed it using a mobile-first approach, meaning your content takes center-stage, regardless of whether your visitors arrive by smartphone, tablet, laptop, or desktop computer.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: black, blue, gray, pink, purple, white, yellow, dark, light, two-columns, left-sidebar, fixed-layout, responsive-layout, accessibility-ready, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-images, microformats, post-formats, rtl-language-support, sticky-post, threaded-comments, translation-ready
Text Domain: twentyfifteen

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/* ==================== our service ==================== */

@import url('https://fonts.googleapis.com/css?family=Lato:300,400,700');

#top_ourservice{
text-align:center;
}

#top_ourservice h2 {
    margin: 0 0 30px;
    color: #000;
    letter-spacing: 1px;
    font-size: 26px;
    font-weight: 600;
}

#top_ourservice ul li a.link:hover {
    color: #fff;
    background-color: #e60414;
}

#top_ourservice ul li a.link {
    font-size: 16px;
    font-weight: 600;
    display: block;
}

#top_ourservice ul li a.link {
    margin: 0 3%;
    padding: 15px 0 10px;
    border: 2px solid #e60414;
    border-radius: 30px;
    display: block;
}

#top_ourservice ul li {
    width: 30%;
    float: left;
    text-align: center;
    background: none;
    border: 0;
}

/* ==================== footer ==================== */

#footerGooglemap {
    line-height: 0;
    width: 100%;
    height: 400px;
}

footer {
    margin-top: 0px;
}


/* ==================== common ==================== */

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    font-size: 0;
    clear: both;
    visibility: hidden;
}


/* ==================== 以下案件ごと設定 ==================== */
html, body {
  font-family:  'Lato',
                "游ゴシック",
                "Yu Gothic",
                YuGothic,
                'ヒラギノ角ゴ Pro W3',
                'Hiragino Kaku Gothic Pro',
                'メイリオ',
                Meiryo,
                Osaka,
                sans-serif;
}
iframe {
  vertical-align: bottom;
}

a {
  color: #274D80;
}
a:hover,
a:active {
  color: #fe6661;
}
table {
  border-collapse: collapse;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}
table thead th,
table thead td {
  text-align: center;
}
table th,
table td {
  width: auto;
  padding: 8px 3%;
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
}
table th {
  background-color: #f6f6f6;
}

.imgFr {
  margin: 0 0 30px 30px;
  float: right;
  display: inline-block;
}
.imgFl {
  margin: 0 30px 30px 0;
  float: left;
  display: inline-block;
}


/* header */
header {
  background: url(./images/header_bg.png) repeat center #FFF;
}
body.home header #headerContentInner {
  position: relative;
}
header .tel a {
  padding: 0 0 0 25px;
  color: #FFF;
  font-size: 18pt;
  font-weight: 400;
  background: url(./images/header_tel_icon.png) no-repeat left center;
}
header #headerContent .right {
  text-align: center;
}
header #headerContent .right p {
  margin-left: 15px;
  display: inline-block;
  vertical-align: top;
}
header .tel,
header .inquiry {
  display: inline-block;
}
header .tel {
  margin-bottom: 0;
}
header .inquiry {
  margin: 0;
}
header #headerContent .right p a {
  padding: 10px 25%;
  color: #000;
  line-height: 1.4;
  font-size: 13px;
  font-weight: 400;
  background-color: #fff;
  position: relative;
  border: 3px solid #e5e5e5;
  display: block;
  text-decoration: none;
}
header #headerContent .right p a:hover {
  background-color: #f2d4da;
}
header #headerContent .right p a:before {
  content: '';
  width: 0;
  height: 0;
  margin: 0;
  background-image: none;
  border-top: 9px solid #93142e;
  border-left: 9px solid transparent;
  display: block;
  position: absolute;
  top: 5px;
  right: 5px;
  bottom: auto;
  left: auto;
}


/* globalNav */
#globalNav li {
}


/* footer */
.footerMap {
  padding-top: 50px;
  text-align: center;
  border-top: 1px solid #f7eac8;
}
.footerMap h2.h2S {
  border-bottom: 0;
}
.footerMap .footerMapAccess {
  margin-bottom: 50px;
  padding: 20px 10px 0;
  display: inline-block;
  position: relative;
}
.footerMap .footerMapAccess p {
  font-size: 13px;
}
.footerMap .footerMapAccess p strong {
  color: #000;
  display: block;
}
.footerMap .footerMapAccess p.bg {
  margin: 0;
  padding: 20px 10px;
  font-size: 11px;
  background-color: #FCF9EB;
}
.footerMap .footerMapAccess img.img {
  padding-top: 20px;
}

.gotoPageTop {
  width: 52px;
  height: 52px;
  margin: 0;
  position: absolute;
  right: 30px;
  bottom: 30px;
}
.footer_inner {
  border-top: 0px solid #EEE;
  padding: 8px 0 0;
  background: #375a79;
}
footer {
  position: relative;
}
footer #footerLogo {
  margin-bottom: 30px;
}
footer .tel,
footer .mail {
  margin: 0;
  display: inline-block;
  font-size: 13px;
}
footer .tel a {
  padding-left: 25px;
}
footer .tel a:before {
  width: 19px;
  height: 19px;
  margin: 0;
  top: 0px;
  background: url(./images/footer_tel.png) no-repeat left center;
}

footer .mail a {
  padding-left: 25px;
  top: 2px;
  background: url(./images/footer_mail.png) no-repeat left center;
}

footer .copy {
  padding: 30px 0;
  color: #9ab0c4;
  background-color: #375a79;
}
footer .tel {
  margin-bottom: 10px;
}
footer .tel a {
  line-height: 1.4;
  font-weight: 400;
}
footer .tel .fax {
  padding-left: 40px;
  display: block;
  font-size: 14px;
}

footer .contact {
  padding: 10px 0 0;
}
footer .contact a {
  padding: 10px 25%;
  color: #000;
  line-height: 1.4;
  font-size: 13px;
  font-weight: 400;
  background-color: #fff;
  position: relative;
  border: 3px solid #e5e5e5;
  display: inline-block;
  text-decoration: none;
}
footer .contact a:hover {
  background-color: #f2d4da;
}
footer .contact a:before {
  content: '';
  width: 0;
  height: 0;
  margin: 0;
  background-image: none;
  border-top: 9px solid #93142e;
  border-left: 9px solid transparent;
  display: block;
  position: absolute;
  top: 5px;
  right: 5px;
  bottom: auto;
  left: auto;
}

#footerLink ul a {
  font-weight: 400;
  color: #FFF;
}
#footerLink ul.bn a:before {
  padding: 0;
  background: none;
}
#footerLink ul a:before {
  background: url(./images/footer_menu_arrow.png) no-repeat left center;
}
#footerLink ul li.title a {
  padding: 0;
}
#footerLink ul li.title a:before {
  background: none;
}
#footerLink ul li.title strong {
  color: #FFF;
}


/* title */
.hdg1 {
  margin-bottom: 30px;
  color: #000;
  font-size: 18px;
  font-weight: 400;
  border: 2px solid #c5c5c5;
  background: url(./images/hdg1_bg.png) no-repeat center;
  -webkit-background-size: cover;
       -o-background-size: cover;
          background-size: cover;
}
.h2S {
  margin: 0 0 30px;
  padding: 0 0 10px;
  color: #93142E;
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  border-bottom: 1px solid #93142E;
}
.hdg2,
body.single article h2 {
  margin: 0 0 20px;
  padding: 15px;
  color: #000;
  font-size: 16px;
  font-weight: 600;
  background: url(./images/h3_bg.png) repeat center;
  border: 0;
  border-top: 3px solid #98C0EA;
}
.hdg2 {
  clear: both;
}
.hdg2::before,
body.single article h2::before {
  background: none;
}

.hdg3 {
  color: #000;
  font-size: 16px;
  font-weight: 600;
  border-bottom: 1px dotted #ccc;
}
.hdg3::before,
body.single article h3::before {
  background-color: #93142e;
}

/* コンテンツ */
.contentsBg {
  padding-bottom: 50px;
  background: url(./images/top_contentsBg.jpg) no-repeat center top;
  -webkit-background-size: cover;
       -o-background-size: cover;
          background-size: cover;
}
#container {
  margin: 0;
  padding: 35px 0;
  background-color: #FFF;
}
.page_contents .content {
  margin: 0 0 40px;
}
#topicPath {
  margin: 0;
  padding: 17px 0 15px;
  background-color: transparent;
}

/* aside */
#aside .sideBlock {
  margin: 0 0 20px;
  padding: 10px 13px;
  border: 2px solid #98C0EA;
}
#aside .sideBlock h3 {
  margin: 0;
  padding: 10px 30px;
  font-weight: 600;
  background-repeat: no-repeat;
  background-position: left center;
}
#aside #sideNavi h3 {
  background-image: url(./images/sideNavi_h3_icon.png);
}
#aside #sideSalonSearch h3 {
  background-image: url(./images/sideSalonSearch_h3_icon.png);
}
#aside #sideNews h3 {
  background-image: url(./images/sideNews_h3_icon.png);
}
#aside .sideBlock ul {
  margin: 0;
  padding: 0;
}
#aside .sideBlock ul li {
  margin: 0;
  padding: 0;
  font-size: 13px;
  border-top: 1px solid #eee;
}
#aside .sideBlock ul li a {
  padding: 10px 5px 10px 15px;
  display: block;
  color: #000;
  text-decoration: none;
}
#aside .sideBlock ul li a:hover {
  background-color: #f6f6f6 !important;
}
#aside #sideNavi ul li a {
  background-image: url(./images/arrow_sideNavi.png);
  background-repeat: no-repeat;
  background-position: left center;
}
#aside #sideSalonSearch .searchArea {
  background-color: #F1F1F1;
}
#aside #sideSalonSearch form {
  letter-spacing: -.4em;
}
#aside #sideSalonSearch input {
  padding: 10px;
  font-size: 13px;
  letter-spacing: normal;
  vertical-align: middle;
  display: inline-block;
  border: none;
  background-color: #F1F1F1;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
#aside #sideSalonSearch input#s {
  width: 90%;
}
#aside #sideSalonSearch input#btn {
  padding: 0;
  width: 15px;
}
#aside #sideNews ul li .date {
  color: #A0A0A0;
  font-size: 12px;
}
#aside #sideNews ul li .content {
  margin-top: -5px;
  color: #6e9ecf;
  text-decoration: underline;
}


/* コンテンツ共通 */
.page_contents .point {
  margin: 0 3% 30px;
  padding: 20px 3%;
  border: 1px solid #ccc;
  background-color: #f7f7f7;
}
.page_contents .point .remarks {
  font-size: 80%;
  border-collapse: collapse;
}
.page_contents .point .point_table {
  border-right: 1px dotted #ccc;
  border-bottom: 1px dotted #ccc;
}
.page_contents .point .point_table th,
.page_contents .point .point_table td {
  padding: 5px 3%;
  border-top: 1px dotted #ccc;
  border-left: 1px dotted #ccc;
}
.page_contents .page_contents_visual {
  margin: 0 0 20px;
}
.attention {
  margin: 0 10px 20px;
  padding: 20px;
  border: 1px solid #98c0ea;
  background-color: #f4fafc;
}
.attention ul li{
  list-style: inside disc;
}


/* top page */
#topBasicKnowledge {
  margin-bottom: 45px;
  padding: 45px 0 20px;
  text-align: center;
  background: url(./images/topBasicKnowledge_bg.jpg) no-repeat center;
  -webkit-background-size: cover;
       -o-background-size: cover;
          background-size: cover;
}
#topBasicKnowledge h2 {
  margin: 0 0 30px;
}
#topBasicKnowledge ul {
  margin: 0;
  padding: 0;
}
#topBasicKnowledge ul li {
  margin: 0 0 20px;
  padding: 0;
}
#topBasicKnowledge ul li span {
  margin: 0;
  padding: 0;
  display: block;
}
#topBasicKnowledge ul li a {
  color: #000;
  text-decoration: none;
}

.topRecent {
  margin: 0 0 40px;
}
.topRecent h2 {
  margin: 0 0 5px;
}
.topRecent .recent_posts ul {
  margin: 0;
  padding: 0;
}
.topRecent .recent_posts ul li {
  margin: 0 0 20px;
  padding: 0;
  border-bottom: 1px solid #e5e5e5;
}
.topRecent .recent_posts ul li a {
  padding: 20px 10px 0;
  display: block;
  text-decoration: none;
}
.topRecent .recent_posts ul li a:hover {
  color: #000;
  background-color: #f6f6f6;
}
.topRecent .recent_posts ul li .img {
  margin: 0 0 20px;
  display: block;
}
.topRecent .recent_posts ul li .txt {
  margin: 0 0 20px;
  display: block;
}
.topRecent .recent_posts ul li .txt .title {
  margin: 0 0 5px;
  color: #000;
  font-size: 14px;
  font-weight: 600;
}
.topRecent .recent_posts ul li .txt p {
  margin: 0;
  color: #000;
  font-size: 11px;
}

/* 問い合わせフォーム */
.btnTy01 a,
#respond .form-submit a,
.btnTy01 button,
#respond .form-submit button {
  background-color: #93142e;
}
.btnTy01 a:focus,
#respond .form-submit a:focus,
.btnTy01 a:hover,
#respond .form-submit a:hover,
.btnTy01 a.current,
#respond .form-submit a.current,
.btnTy01 button:focus,
#respond .form-submit button:focus,
.btnTy01 button:hover,
#respond .form-submit button:hover,
.btnTy01 button.current,
#respond .form-submit button.current {
  background-color: #ca2244;
}


/* 一般的なケアの流れ */
#flow .content_link {
  padding: 20px;
  display: inline-block;
  border: 1px solid #ccc;
}
#flow .content_link li {
  list-style: decimal inside;
}


/* セルフホワイトニングの効果 */
#self_whitening_effect .effect {
  margin: 0 0 30px;
  border: 1px dotted #ccc;
  text-align: center;
}
#self_whitening_effect .effect .effect_inner {
  padding: 20px 20px 0;
}
#self_whitening_effect .effect .effect_table {
  width: 100%;
  margin: 0 auto 20px;
  display: table;
}
#self_whitening_effect .effect .effect_table th,
#self_whitening_effect .effect .effect_table td {
  display: table-cell;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
#self_whitening_effect .effect .effect_table th {
  width: 25%;
}
#self_whitening_effect .effect .effect_table td {
  width: 75%;
}
#self_whitening_effect .effect .img {
  margin: 0 auto;
}




@media screen and (min-width:751px) {
/* header */
  .home header #headerContent {
    position: relative;
    right: 0;
    left: 0;
  }
  header #headerContent {
    padding: 0;
  }
  header #headerContentInner {
    width: 103px;
    padding-top: 15px;
    float: left;
  }
  header #headerContent .left {
    padding-top: 0;
  }
  header .inquiryArea {
    margin: 0 0 25px;
    padding: 25px 0 0;
  }


/* globalNav */
  #globalNav {
    /*width: 596px;*/
    margin: 0;
    padding: 0;
    text-align: center;
    float: right;
  }
  #globalNav {
    background-color: transparent;
    border-left: 1px solid #fff;
  }
  #globalNav .wrap ul {
    display: block;
  }
  #globalNav .wrap > ul > li > a {
    height: 40px;
    padding: 20px 20px 15px;
    line-height: 1.4;
    letter-spacing: normal;
    font-size: 14px;
    font-weight: 400;
    border-right: 1px solid #fff;
    vertical-align: middle;
    display: block;
  }
  #globalNav .wrap > ul > li > a:before {
    content: '';
    width: 0;
    height: 0;
    margin: 0;
    background-image: none;
    border: 0;
    border-top: 12px solid #fff;
    border-left: 12px solid transparent;
    display: block;
    position: absolute;
    top: 6px;
    right: 6px;
    bottom: auto;
    left: auto;
  }
  #globalNav .wrap > ul > li > a:hover:before {
    border-top: 12px solid #8c0691;
  }

  #globalNav .wrap ul li.last a {
    border: 0;
  }
  #globalNav .wrap > ul > li {
    margin: 0;
    float: left;
    display: block;
  }
  #globalNav .wrap > ul > li span {
    font-size: 10px;
  }

  #globalNav .wrap > ul > li > a,
  #globalNav .wrap > ul > li > a.current {color: #000 !important;}
  #globalNav .wrap > ul > li > a:hover,
  #globalNav .wrap > ul > li > a.current:hover {color: #8c0691 !important;}

  #globalNav .wrap ul li span {
    display: block;
  }

/* footer */
  .footerMap .footerMapAccess {
    padding-right: 80px;
    padding-left: 80px;
  }
  .footerMap .footerMapAccess img.img {
    position: absolute;
    right: 0;
    bottom: 15px;
  }
  .footerMap .footerMapAccess p.bg {
    padding-right: 50px;
    padding-left: 50px;
  }

  footer .address {
    margin: 0;
    font-size: 13px;
  }
  footer .tel a {
    font-size: 13px;
  }
  footer .right {
    width: 620px;
  }
  #footerLink ul {
    margin-left: 80px;
  }
  #footerLink ul li {
    margin: 0 0 5px;
  }
  #footerLink ul li.last {
    margin-bottom: 30px;
  }
  #footerLink ul a {
    font-size: 12px;
    padding-left: 12px;
  }

/* title */
  .hdg1 {
    padding: 35px 10px;
    font-size: 1.4em;
  }

  /* コンテンツ */
  div.contentsBg div#container {
    width: 1020px;
    margin: 0 auto;
    padding: 35px 40px;
    background-color: #FFF;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
  }
  #main {
    width: 640px;
    float: left;
  }
  #aside {
    width: 260px;
    float: right;
  }

/* top page */
  .home #container,
  .home #main.col1 {
    width: 100%;
  }

  #topBasicKnowledge #topBasicKnowledge_inner {
    width: 940px;
    margin: 0 auto;
  }
  #topBasicKnowledge ul li {
    width: 25%;
    margin: 0 0 20px;
    padding: 0;
    float: left;
  }

  .topRecent .recent_posts ul li .img {
    width: 220px;
    float: left;
  }
  .topRecent .recent_posts ul li .txt {
    width: 380px;
    float: right;
  }



}

@media screen and (max-width:750px) {
  .imgFr,
  .imgFl {
    margin: 0 0 30px;
    float: none;
    text-align: center;
    display: block;
  }

/* header */

  header #headerContent {
    padding: 10px 0;
    background-color: transparent;
  }
  header .inquiry {
    float: none;
  }
  header #headerContent .right p {
    margin: 0 1%;
  }
  header #headerContent .right p a {
    padding: 10px 20%;
  }

/* globalNav */
  p#gnavMenu {
    margin: 0;
    background-color: #d265d6;
  }
  #globalNav {
    margin-bottom: 30px;
    bottom: auto;
    left: 0;
    background-color: #d265d6;
  }

/* footer */
  #footerLink ul.bn {
    width: 100%;
    margin: 0;
    padding: 20px 0 0;
    float: none;
  }
  #footerLink ul.bn li {
    text-align: center;
  }
  #footerLink ul.bn li a {
    padding: 0;
  }

/* コンテンツ */
  div.contentsBg div#container {
    margin: 0 3%;
  }

/* top page */
  #topBasicKnowledge ul li {
    width: 46%;
    margin: 0 2% 20px;
    float: left;
  }
  #topBasicKnowledge ul li span {
    font-size: 10px;
  }

}

/*form*/
.form_table th{
width:30%;
}
.wpcf7-form-control-wrap{
box-sizing:border-box;
}
button[type=submit], input[type=submit]{
background:none;
margin-top:25px;
display:block;
text-align:center;
padding: 15px 13px;
border: 2px solid #98C0EA;
width:100%;
}
.form_table td span,.form_table td input,.form_table td textarea{
display:block;
width:100%;
box-sizing:border-box;
}

@media screen and (max-width:750px) {
.form_table,.form_table tbody,.form_table tr,.form_table th,.form_table td,.form_table td span,.form_table td input{
display:block;
max-width:100%;
box-sizing:border-box;
}
.form_table th{
width:100%;
}

}