@charset 'utf-8';

/* 下層共通
--------------------------------------- */
#main .wrap-block{width:850px;margin:auto;}
#main .wrap:last-of-type{padding-bottom:0;}
#main h3.def{
  margin-bottom:20px;
  font-size:22px;
  font-weight:600;
  text-align:center;
}
#main h3.def span{
  position:relative;
  display:inline-block;
  padding:0 55px;
}
#main h3.def span:before,
#main h3.def span:after{
  content:'';
  position:absolute;
  top:47%;
  display:inline-block;
  width:45px;
  height:1px;
  background-color:#408dee;
}
#main h3.def span:before{left:0;}
#main h3.def span:after{right:0;}

@media screen and (max-width:640px){
  #main{padding:50px 0 0;}
  #main .wrap-block{width:580px;}
  #main h3.def{font-size:38px;line-height:1.0;margin:50px 0;}
}

/* コンタクトレンズ
--------------------------------------- */
#contactlens{}
@media screen and (max-width:640px){}

#flow{}
#main #flow .wrap{padding:0 0 70px;}
#flow .attent{margin-bottom:40px;}
#flow h4{
  margin-bottom:20px;
  font-size:20px;
  font-weight:600;
  text-align:center;
}
#flow .block-flow{
  margin-bottom:40px;
  padding-bottom:40px;
  border-bottom:1px solid #ccc;
}
#flow .block-flow .fig{width:220px;}
#flow .block-flow dl.txt{width:610px;}
#flow .block-flow dl.txt dt{margin-bottom:10px;font-weight:600;}
#flow .block-flow dl.txt dd{margin-left:1.0em;}
#flow .block-meyasu{
  width:520px;
  margin:auto;
  padding:5px;
  background-color:#edf2c5;
  border-radius:9px;
}
#flow .block-meyasu .line{
  width:510px;
  margin:auto;
  padding:20px 30px;
  border:1px solid #fff;
  border-radius:7px;
}
#flow .block-meyasu h5{
  margin-bottom:30px;
  font-size:20px;
  font-weight:600;
  text-align:center;
}
#flow .block-meyasu h5 span{border-bottom:2px solid #ffa000;}
#flow .block-meyasu dl{margin-bottom:30px;}
#flow .block-meyasu dl:last-of-type{margin-bottom:0;}
#flow .block-meyasu dl dt{font-weight:600;}
#flow .block-meyasu dl dd{margin-left:1.0em;}
@media screen and (max-width:640px){
  #flow h4{font-size:36px;margin:70px 0 50px;}

  #flow .block-flow .fl,
  #flow .block-flow .fr{float:none;}
  #flow .block-flow .fig{width:540px;margin:20px auto 0;}
  #flow .block-flow dl.txt{width:580px;}
  #flow .block-flow dl.txt dd{margin-left:0;}

  #flow .block-meyasu{width:580px;}
  #flow .block-meyasu .line{
    width:570px;
    padding:20px 20px;
  }
  #flow .block-meyasu h5{font-size:36px;}
  #flow .block-meyasu dl dd{padding-left:3.0em;text-indent:-3.0em;}
}

#major{}
#major .article{}
#major h4{
  margin-bottom:20px;
  padding-left:1.0em;
  font-weight:600;
  border-left:8px double #ffa000;
  border-bottom:1px solid #ffa000;
}

#major ul{clear:both;}
#major ul li{width:410px;margin-bottom:40px;}
#major ul li:nth-of-type(odd){float:left;}
#major ul li:nth-of-type(even){float:right;}
#major .article .photo{
  float:left;
  width:160px;
}
#major .article .detail{
  float:right;
  width:240px;
  position:relative;
}
#major .article .detail p.name{}
#major .article .detail p.name_s{font-size:14px;}
#major .article .detail p.product{font-size:12px;}
#major .article .detail .lens_photo{}
#major .article .detail .icon{
  position:absolute;
  top:0;
  right:0;
  width:42px;
  height:41px;
}
@media screen and (max-width:640px){
  #major ul li{width:580px;margin-bottom:40px;}
  #major ul li:nth-of-type(odd),
  #major ul li:nth-of-type(even){float:none;}
  #major .article .photo{
    float:none;
    width:400px;
    margin:0 auto 10px;
  }
  #major .article .photo img{width:100%;}
  #major .article .detail{
    float:none;
    width:500px;
    margin:auto;
  }
  #major .article .detail p.name_s{font-size:28px;}
  #major .article .detail p.product{font-size:24px;}
  #major .article .detail .lens_photo{
    width:400px;
    margin:auto;
  }
  #major .article .lens_photo img{width:100%;}
  #major .article .detail .icon{
    width:84px;
    height:82px;
  }
  #major .article .lens_photo img,
  #major .article .detail .icon img{width:100%;}
}

/* 診療時間
--------------------------------------- */
#guide{}
@media screen and (max-width:640px){
}

/* 院内のご案内
--------------------------------------- */
.facility{}
.facility .block{margin-bottom:40px;}
.facility .box{width:400px;}
.facility .box:nth-of-type(odd){float:left;}
.facility .box:nth-of-type(even){float:right;}
.facility h4{
  margin-bottom:2px;
  padding:6px 0 4px 1.0em;
  font-size:18px;
  line-height:1.2;
  text-align:center;
  background-color:#fff3c3;
}
.facility .vert{}
.facility .vert .pho{
  width:400px;
  margin:0 auto 10px;
}
.facility .vert .detail{
  width:400px;
  line-height:1.5;
}
.facility .hori{}
.facility .hori .pho{
  float:left;
  width:200px;
}
.facility .hori .detail{
  float:right;
  width:200px;
  padding:10px 0 0 10px;
  line-height:1.5;
}

@media screen and (max-width:640px){
  .facility .block{margin-bottom:0;}
  .facility .box{width:580px;margin:0 auto 70px;}
  .facility .box:nth-of-type(odd),
  .facility .box:nth-of-type(even){float:none;}
  .facility h4{font-size:36px;text-align:left;}
  .facility .vert .pho{width:580px;}
  .facility .vert .detail{width:580px;}
  .facility .hori .pho{
    float:left;
    width:260px;
    margin:0 10px 10px 0;
  }
  .facility .hori .detail{
    float:none;
    width:initial;
    padding:10px 0 0 0;
  }
}
#indoor{}
#facility{}
@media screen and (max-width:640px){}

/* アクセス
--------------------------------------- */
#access{}
#access .wrap{}
#access .block-l,
#access .block-r{float:none;width:850px;margin:auto;}
#access .block-l{margin-bottom:50px;}
#access .gmap{
  width:850px;
  padding-bottom:56.25%;
}
#access .fig{
  float:left;
  width:430px;
  margin:0 auto 20px;
}
#access .info{
  float:right;
  width:390px;
}
#access .floor{}
#access .info dl{
  margin-bottom:10px;
  font-size:16px;
}
#access .info dl dt{
  width:80px;
  white-space:nowrap;
}
#access .info dl dd{
  width:310px;
}
@media screen and (max-width:640px){
  #access .block-l,
  #access .block-r{width:580px;}
  #access .gmap{
    width:580px;
    margin-bottom:50px;
    padding-bottom:77%;
  }
  #access .fig{float:none;width:360px;}
  #access .info{
    float:none;
    width:580px;
    margin:auto;
  }
  #access .floor{
    width:580px;
    margin:0 auto 50px;
  }
  #access .info dl{
    font-size:28px;
  }
  #access .info dl dt{width:120px;}
  #access .info dl dd{width:460px;}
}

/* 目の病気について
--------------------------------------- */
#eye{}
#eye .wrap-block{width:720px;margin:auto;}
#eye  h3.eye,
#eye .block-detail .detail h5{
  margin-bottom:20px;
  padding:8px 0 8px 10px;
  font-size:18px;
  font-weight:600;
  line-height:1.2;
  border-left:8px double #ffa000;
  border-bottom:1px solid #ffa000;
}
@media screen and (max-width:640px){
  #eye  h3.eye,
  #eye .block-detail .detail h5{font-size:36px;}
}

/* リンク */
#eye .block-link p.mi{
  font-size:18px;
  font-weight:600;
}
#eye .block-link{}
#eye .block-link .box-link1,
#eye .block-link .box-link2,
#eye .block-link .box-link3{margin-bottom:20px;}
#eye .block-link .box-link1 .btn-l{
  float:left;
  width:338px;
}
#eye .block-link .box-link1 .btn-r{
  float:right;
  width:338px;
}
#eye .block-link .box-link1 .btn-l,
#eye .block-link .box-link1 .btn-r{border:1px solid #ffa000;}
#eye .block-link .box-link1 .btn-l .in,
#eye .block-link .box-link1 .btn-r .in{border:1px solid #fff;}
#eye .block-link .box-link1 a{
  display:block;
  width:334px;
  padding:8px 0;
  font-size:18px;
  font-weight:600;
  text-align:center;
  background-color:#fff;
  border:1px solid #ffa000;
  transition:color 300ms,background-color 300ms;
}
#eye .block-link .box-link1 .current a,
#eye .block-link .box-link1 a:hover{
  color:#fff;
  background-color:#f8b300;
}

#eye .block-link .box-link2{
  margin-bottom:40px;
  padding:20px 30px;
  border:1px solid #ffa000;
}
#eye .block-link .box-link2 p.mi{margin-bottom:10px;}
#eye .block-link .box-link2 ul{margin-bottom:20px;}
#eye .block-link .box-link2 ul.words{text-align:center;}
#eye .block-link .box-link2 ul:last-of-type{margin-bottom:0;}

#eye .block-link .box-link2 ul li{
  display:inline-block;
  margin-right:20px;
}
#eye .block-link .box-link2 ul li a{
  display:block;
  padding:4px 20px;
  color:#ffa000;
  white-space:nowrap;
  background-color:#fff;
  border:1px solid #ffa000;
  border-radius:18px;
  transition:color 300ms,background-color 300ms;
}
#eye .block-link .box-link2 ul li.current a,
#eye .block-link .box-link2 ul li a:hover{
  color:#fff;
  background-color:#ffa000;
}

#eye .block-link .box-link3 ul{
  margin-left:1.0em;
  padding-left:1.0em;
  text-indent:-1.0em;
}
#eye .block-link .box-link3 ul li a:hover{text-decoration:underline;}

@media screen and (max-width:640px){
  #eye .wrap-block{width:580px;margin:auto;}
  #eye .block-link p.mi{font-size:36px;}
  #eye .block-link .box-link1,
  #eye .block-link .box-link2,
  #eye .block-link .box-link3{
    width:578px;
    margin-bottom:40px;
  }
  #eye .block-link .box-link1 .btn-l,
  #eye .block-link .box-link1 .btn-r{
    float:none;
    width:578px;
  }
  #eye .block-link .box-link1 .btn-l{margin-bottom:30px;}
  #eye .block-link .box-link1 a{
    width:574px;
    padding:12px 0;
    font-size:32px;
  }

  #eye .block-link .box-link2{padding:30px 10px 0;}
  #eye .block-link .box-link2 ul{margin-bottom:0px;}
  #eye .block-link .box-link2 ul li{
    margin-right:30px;
    margin-bottom:30px;
  }
  #eye .block-link .box-link2 ul li a{padding:8px 20px;}
  #eye .block-link .box-link2 ul.words li a{padding:8px 30px;}
}

/* 詳細 */
#eye .block-detail{}
/*#eye .block-detail .detail{margin-left:1.0em;}*/
/*#eye .block-detail .detail h5{
  font-size:18px;
  font-weight:600;
  margin-bottom:10px;
}*/
#eye .block-detail .detail p{}
#eye .block-detail .detail ul{
  margin-left:1.0em;
  padding-left:1.0em;
  text-indent:-1.0em;
}
#eye .block-detail .detail ul ul{margin:1.0em 0;}
#eye .block-detail .detail a{text-decoration:underline;}
#eye .block-detail .detail dl{margin-bottom:1.0em;}
/*#eye .block-detail .detail dl dt{font-weight:600;}*/
#eye .block-detail .detail dl dt:before{content:'\025a0';}

@media screen and (max-width:640px){
  #eye .block-detail .detail{margin-left:0;}
}

/* 関連 */
#eye .block-related{
  margin-top:70px;
  padding:1.0em 20px 1.0em;
  border:1px solid #ffa000;
}
#eye .block-related h3.rel{
  margin-top:-1.3em;
  font-size:18px;
  font-weight:600;
  line-height:1.0;
}
#eye .block-related h3.rel span{
  padding:0 10px;
  background:#fff;
}
#eye .block-related ul{
  margin-top:20px;
  padding-left:1.0em;
  text-indent:-1.0em;
}
#eye .block-related ul li:before{
  content:'\025b6';
  color:#ffa000;
}
#eye .block-related ul li a:hover{text-decoration:underline;}

@media screen and (max-width:640px){
  #eye .block-related h3.rel{font-size:36px;}
}

/* 目の病気Ｑ＆Ａ
--------------------------------------- */
#faq{}

/* 目次 */
#faq.idx{}
#faq.idx ul{}
#faq.idx ul li{width:410px;}
#faq.idx ul li:nth-child(odd){float:left;}
#faq.idx ul li:nth-child(even){float:right;}
#faq.idx ul li a{
  display:block;
  width:406px;
  margin-bottom:30px;
  padding:12px 0;
  font-size:18px;
  font-weight:600;
  color:#fff;
  text-align:center;
  background-color:rgba(255,160,0,1.0);
  border-radius:9px;
  border:2px solid rgba(255,255,255,1.0);
  transition:background-color 300ms,border-color 300ms;
}
#faq.idx ul li a:hover{
  background-color:rgba(248,179,0,1.0);
  border-color:rgba(255,160,0,1.0);
}
@media screen and (max-width:640px){
  #faq.idx ul li{width:560px;margin:0 auto 30px;}
  #faq.idx ul li:nth-child(odd),
  #faq.idx ul li:nth-child(even){float:none;}
  #faq.idx ul li a{
    width:556px;
    font-size:32px;
  }
}

/* 詳細 */
#faq .faq-detail{}
#faq .faq-detail dl{}
#faq .faq-detail dl.q{margin-bottom:10px;}
#faq .faq-detail dl.a{margin-bottom:40px;}
#faq .faq-detail dl dt{
  display:inline-block;
  margin-right:5px;
  width:30px;
  font-size:24px;
  font-weight:600;
  color:#fff;
  border:1px solid #ffa000;
  text-align:center;
  vertical-align:top;
}
#faq .faq-detail dl.q dt{color:#ffffff;background-color:#ffa000;}
#faq .faq-detail dl.a dt{color:#ffa000;background-color:#ffffff;}
#faq .faq-detail dl.q dd{
  margin-top:6px;
  font-size:18px;
  font-weight:600;
}
#faq .faq-detail dl dd{
  display:inline-block;
  width:815px;
  margin-top:4px;
  vertical-align:top;
}
@media screen and (max-width:640px){
  #faq .faq-detail dl.q{margin-bottom:20px;}
  #faq .faq-detail dl dt{
    margin-right:10px;
    width:50px;
    font-size:34px;
  }
  #faq .faq-detail dl.q dd{margin-top:2px;font-size:34px;}
  #faq .faq-detail dl dd{width:520px;}
}

/* NEWS
--------------------------------------- */
#topics .wrap-topics .block-topics{width:850px;margin:auto;}
#topics .wrap-topics .block-topics dl{margin-bottom:8px;font-size:18px;line-height:1.5;}
#topics .wrap-topics .block-topics dt,
#topics .wrap-topics .block-topics dd{display:inline-block;vertical-align:top;}
#topics .wrap-topics .block-topics dt{width:150px;}
#topics .wrap-topics .block-topics dd{width:700px;}
#topics .wrap-topics .block-topics dd a{color:#408dee;}
#topics .wrap-topics .block-topics dd a:hover{text-decoration:underline;}
#topics .wrap-topics .pagination{width:850px;margin:40px auto 0;text-align:center;}
#topics .wrap-topics .pagination .pages{display:none;}
#topics .wrap-topics .pagination a,
#topics .wrap-topics .pagination span.current{
  display:inline-block;
  margin:0 4px 10px;
  padding:2px 8px;
  color:#408dee;
  background-color:#fff;
  border:1px solid #408dee;
  border-radius:3px;
  transition:background-color 300ms;
}
#topics .wrap-topics .pagination a.page{}
#topics .wrap-topics .pagination a:hover,
#topics .wrap-topics .pagination span.current{color:#fff;background-color:#408dee;}
@media screen and (max-width:640px){
  #topics .wrap-topics .block-topics{width:580px;}
  #topics .wrap-topics .block-topics dl{margin-bottom:30px;font-size:32px;}
  #topics .wrap-topics .block-topics dt,
  #topics .wrap-topics .block-topics dd{display:block;}
  #topics .wrap-topics .block-topics dt{width:560px;}
  #topics .wrap-topics .block-topics dd{width:560px;margin-left:0.6em;}
  #topics .wrap-topics .pagination{width:560px;}
}

#topics h3{
  width:850px;
  margin:0 auto 1.0em;
  padding:4px 0 4px 8px;
  font-size:22px;
  font-weight:600;
  border-left:6px solid #408dee;
}
#topics p.date{
  width:850px;
  margin:0 auto 18px;
  font-size:14px;
  text-align:right;
}
#topics .editor-area{
  width:850px;
  margin:auto;
  padding:40px 0;
  font-size:18px;
  color:#525252;
  line-height:1.5;
  border-top:1px dashed #ccc;
  border-bottom:1px dashed #ccc;
}
#topics .back{margin:40px 0 10px;text-align:center;}
#topics .back a{
  padding:4px 10px;
  color:#408dee;
  background-color:#fff;
  border:1px solid #408dee;
  border-radius:5px;
  transition:color 300ms,background-color 300ms;
}
#topics .back a:hover{color:#fff;background-color:#408dee;}
@media screen and (max-width:640px){
  #topics h3{width:580px;font-size:34px;}
  #topics p.date{width:580px;font-size:24px;}
  #topics .editor-area{width:580px;font-size:32px;}
}

/* editor-area内 */
#topics .editor-area{}
@media screen and (max-width:640px){
}