@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@500;700&display=swap');


/*--------------------------------------------------------------------------
BASE(PC)
---------------------------------------------------------------------------*/
body {
	/*font: 13px/1.231 arial, helvetica, clean, sans-serif;*/ 
	background-color: #fff;
	-webkit-print-color-adjust: exact;
}


.pc-mode-01 {
    display: block !important;
}
.pc-mode-02 {
    display: inline !important;
}
.sp-mode-01 {
    display: none !important;
}
.sp-mode-02 {
    display: none !important;
}
.pc-inner {
    width: 900px;
    margin: 0 auto;
}
/* フォーマット設定*/
.inner,
.inner-01,
.inner-03 {
	max-width: 940px;
	margin: 0 auto;
}
.inner-02 {
}

.cont-center {
    text-align: center;
}
.cont-left {
	float:left;
}
.cont-right {
	float:right;
}
/* common
-----------------------------------------------------------------*/
.toolBox01 { background-color: #0091da; }

.function01 {
    margin-top: 6px;
    padding-bottom: 6px;
}

.boxList01 {
    margin-top: 20px;
}
img {
	display:inline;
}
a:hover{
	text-decoration:none;
	opacity: 0.7;
}
a:hover img{
    opacity: 0.7;
}
sup {
    font-size: 0.6em;
    vertical-align: super;
}
/* -----------------------------------------------------------------*/



 /* -------------------------------------------------------------------------------------------------------------
	共通pc css
------------------------------------------------------------------------------------------------------------- */

#column_main {
    width: 100%;
}

/* nav
---------------------------------------------------------*/
/* top */
#gnav {
  background: #838bc0;
  /* height: 80px; */
  position: relative;
  padding: 12px 0;
  width: 100vw;
}

#gnav ul {
  width: 940px;
  margin: 0 auto;
  height: 44px;
  border-radius: 22px;
  background-color: #c1c5e0;
  font-size: 0.857em;
  font-weight: bold;
}

#gnav > ul > li {
  float: left;
  height: 100%;
  display: block;
  /* border-right: 1px solid #67201f; */
}

#gnav > ul > li.active {
  background: #fff;
}

#gnav > ul > li:hover {
  background: #fff;
}
#gnav > ul > li > a{
  padding: 0 16px;
  color: #5b4882;
  letter-spacing: 0.05em;
  line-height: 16px;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}
#gnav > ul > li > a:hover,
#gnav > ul > li > a:hover img{
  opacity: 1;
}
#gnav > ul > li:first-child:hover{
  background: #fff;
  border-top-left-radius: 22px;
  border-bottom-left-radius: 22px;
}

/*#mainContainer .face_wrap li {
  padding-top: 37px;
}

#mainContainer .face_wrap li img {
  height: 182px;
  width: auto;
}*/
#gnav > ul .home{
  margin-right: 26px;
  position: relative;
}
#gnav > ul .home a{
  padding-left: 21px;
  padding-right: 25px;
}
#gnav > ul .home::after{
  content: "";
  display: block;
  border-right: 1px solid #838bc0;
  height: 54.5%;
  position: absolute;
  right: -1px;
  top: 22.75%;
}
#gnav.fixed {
  position: fixed;
  top: 0;
  z-index: 1000;
  right: 0;
}

#gnav.fixed + div {
  margin-top: 80px;
}



/*MV*/

.section_vi_bg{
    background: #838bc0;
	overflow: hidden;
}
.cnt_vi01 {
    text-align: center;
    position: relative;
    height: 417px;
    padding: 0;
    border: none;

}
.cnt_vi01 img{
    margin-left: -700px;
    max-width: 1400px;
    position: absolute;
    left: 50%;
}
/*-------------------
	lnv
-------------------*/
.section_lnv_bg {
    background: #838bc0;
}
.list_lnv li {
    float: left;
    width: 50%;
    text-align: center;
    font-size: 1.286em;
    padding-bottom: 0.84em;
    padding-top: 0.8em;
}
.list_lnv li a {
    display: block;
    border-right: 1px #dbdced solid;
}
.list_lnv li:last-child a {
    border-right: 0;
}

/*-----------
リンク
-----------*/
/*赤*/
.link-cnt-01,
.link-01 a{
    font-weight: bold;
    color:#ca1919;
}
.link-01 a:hover{
    color:#d04c4c;
    opacity:0.7;
}
.link-cnt-01::after,
.link-01 a::after{
	content: "";
	background: url(/-/Media/com/50megumi/shiraga/20200904/ico-arrow03.png) no-repeat;
	background-size: 1em;
	display: inline-block;
	width: 1em;
	height: 1em;
	margin-left: 0.75em;
	vertical-align: middle;
}

/*-----------
ボタン
-----------*/
.btn-02 a:hover,
.btn-03 a:hover,
.btn-04 a .open:hover,
.btn-04 a .close:hover,
.btn-05 a .open:hover,
.btn-05 a .close:hover{
	opacity: 0.7;
}
.btn-02,
.btn-03{
  display: inline-block;
}
.btn-02 a,
.btn-03 a{
    padding-top: 0.45em;
    padding-bottom: 0.45em;
    padding-left: 1.667em;
    padding-right: 2.381em;
    -webkit-border-radius: 2em;
    -moz-border-radius: 2em;
    border-radius: 2em;
    display: inline-block;
    width: 100%;
    box-sizing: border-box;
    font-weight: normal;
    font-size: 1.167em;
    color: #fff;
    background: url(/-/Media/com/learn-more/eyecare2020/myopia/common/img/ico-arrow01.png) no-repeat right 1.667em center #5a4882;
    background-size: 0.444em;
}
.btn-03 a{
    padding-top: 0.35em;
    padding-bottom: 0.35em;
    border-radius: 1em;
}
/*アコーディオン　ボタン(イラストあり)*/
.btn-04 .open,
.btn-04 .close {
    display: none;
}

.btn-04 .active{
    display:block;
}
.slide-clm {
    display: none;
	background-color: #eee;
	padding: 80px 0;
	text-align: center;
}
.slide-clm-02{
	display: block;
	margin-bottom: 100px;
}
.slide-btn-02{
	background-color: #dbdced;
	color: #5a4882;
	font-size: 1.6em;
	display: inline-block;
	border-radius: 12px;
	width: 100%;
	padding: 22px 40px;
	margin-bottom: 45px;
	position: relative;
	box-sizing: border-box;
}
.slide-btn-02::before{
	content: "";
    background: url(/-/Media/com/learn-more/eyecare2020/myopia/faq/ico_faq_02.png) no-repeat center center;
	position: absolute;
	bottom: -7px;
	right: 0;
	width: 36px;
	height: 37px;
	background-size: 100%;
}
.section_faq:nth-child(even) .slide-btn-02::before{
    background: url(/-/Media/com/learn-more/eyecare2020/myopia/faq/ico_faq_01.png) no-repeat center center;
    background-size: 100%;
	right: auto;
	left: 0;
}


/*アコーディオン　ボタン(赤)*/
.btn-05 a .open{
	padding-top: 0.889em;
    padding-bottom: 0.68em;
	padding-left: 1.389em;
    -webkit-border-radius: 2em;
    -moz-border-radius: 2em;
    border-radius: 2em;
    display: inline-block;
    width: 100%;
    box-sizing: border-box;
	font-weight: bold;
	font-size: 1.286em;
    color:#fff;
    background: url(/-/Media/com/learn-more/eyecare2020/myopia/common/img/btn-open01.png) no-repeat right 1.111em center #ca1919;
    background-size: 1.333em;
}


.btn-05 a .close{
	padding-top: 0.889em;
    padding-bottom: 0.68em;
	padding-left: 1.389em;
    -webkit-border-radius: 2em;
    -moz-border-radius: 2em;
    border-radius: 2em;
    display: inline-block;
    width: 100%;
    box-sizing: border-box;
	font-weight: bold;
	font-size: 1.286em;
    color:#fff;
    background: url(/-/Media/com/learn-more/eyecare2020/myopia/common/img/btn-close01.png) no-repeat right 1.111em center #ca1919;
    background-size: 1.333em;
}
.btn-05 a .open,
.btn-05 a .close {
	display:none;
}
.btn-05 a .open.active,
.btn-05 a .close.active {
	display:block;
}

/*テキスト*/
.txt_wrap_01 p {
    line-height:2em;
    margin-bottom: 2em;
}
.txt-01 {
    background: url(/-/Media/com/learn-more/eyecare2020/myopia/common/img/bg-highlight01.png) repeat-x center 0.75em;
    font-weight: bold;
    background-size: auto 0.75em;
}
.txt-02 {
    font-size: 	1.429em;
}
.txt_chuui {
    font-size: 1.214em;
    color: #333;
}
.txt_chuui-02 {
    font-size: 0.778em;
    color: #333;
	line-height: 1.5em;
	margin-top: 1em;
}

/*-----------
list
-----------*/
.myopia_container .list-wrap-01{
	background-color: #eff0f7;
	padding: 40px;
	margin-bottom: 40px;
}
.myopia_container .list-wrap-01 .list-01 .list-ttl{
    height: 24px;
	position: relative;
	padding-left: 48px;
	margin-bottom: 10px;
}
.myopia_container .list-wrap-01 .list-01 p{
	padding-left: 48px;
}
.myopia_container .list-wrap-01 .list-01 li{
	margin-bottom: 40px;
}
.myopia_container .list-wrap-01 .list-01 li:last-child{
	margin-bottom: 0;
}
.myopia_container .list-wrap-01 .list-01 .list-ttl img{
	max-width: none;
	max-height: 100%;
	width: auto;
}
.myopia_container .list-wrap-01 .list-01 .list-ttl::before {
    background: url(/-/Media/com/learn-more/eyecare2020/myopia/common/img/ico_check.png) no-repeat center center;
    background-size: 100%;
    content: "";
    display: inline-block;
    width: 28px;
    height: 28px;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}




@media screen and (max-width: 940px) {
.section_vi {
    overflow: hidden;
}

.section_vi .cnt_vi01 {
    overflow: hidden;
}
}
@media screen and (max-width: 768px) {
/*--------------------------------------------------------------------------
BASE(tablet,sp)
---------------------------------------------------------------------------*/
.pc-inner {
    width: 90%;
}

img {
	width: 100%;
}
.inner{
	width: 90%;
}
.inner-01{
	width: 100%;
}
.inner-03{
	width: 94%;
}
.toolBox01 {
	padding: 3% 0;
}
.pc-mode-01 {
	display: none !important;
}
.pc-mode-02 {
	display: none !important;
}
.pc-mode-03 {
	display: none !important;
}
.sp-mode-01 {
	display: block !important;
}
.sp-mode-02 {
	display: inline !important;
}
.sp-mode-03 {
	display: inline-block !important;
}
.sp-mode-04 {
	display: table !important;
}



 /* -------------------------------------------------------------------------------------------------------------
	共通tablet css
------------------------------------------------------------------------------------------------------------- */
 /* nav
---------------------------------------------------------*/
  #gnav.fixed {
    top: 0;
  }
  #gnav.fixed + div {
    /* margin-top: 70px; */
    margin-top: 0;
  }
  nav#gnav a {
    display: block;
    position: relative;
  }
  nav#gnav ul ul {
    display: none;
  }
  nav#gnav ul ul a {
    background-size: 16px;
  }
  nav#gnav .menu .prd_list li:not(:first-child) a,
  nav#gnav ul:nth-child(n + 5) a {
    background-size: 16px;
  }
  nav#gnav .menu .bnr_clm img {
    width: 100%;
  }
  nav#gnav ul li span {
    position: absolute;
    display: block;
    width: 13%;
    top: 50%;
    right: 15px;
    margin-top: -6.5%;
    background: url(https://jp.rohto.com/~/Media/com/50megumi/201709/top/sp/btn_open01.png) no-repeat;
    background-size: 100%;
  }
  nav#gnav ul li span.open {
    background-image: url(https://jp.rohto.com/~/Media/com/50megumi/201709/top/sp/btn_close01.png);
  }


/* top */
  #gnav {
    height: auto;
    padding: 0;
  }
  #gnav ul {
    width: 94%;
    height: inherit;
    background-color: inherit;
    font-size: 4.427vw;
    font-weight: normal;
    letter-spacing: -0.05em;
  }
  #gnav ul li {
    float: none;
    border-bottom: 2px solid #7a6b9b;
  }
  #gnav ul li.home img{
    width: 40.625vw;
  }
  #gnav ul ul li {
    background: #84091d;
  }
  #gnav ul ul li:last-child {
    border: none;
  }
  #gnav .prd_list li > a{
    font-size: 4.427vw;
    color: #fff;
    padding: 1em 0 1em 11vw;
  }
  #gnav .prd_list li.home > a{
    padding-top: 1.3em;
    padding-bottom: 0.8em;
  }
  #gnav .prd_list li:hover > a,
  #gnav .prd_list li:active > a,
  #gnav .prd_list li.active > a{
    font-weight: bold;
    color: #feef3e;
}
  #gnav .head {
    position: absolute;
    right: 0;
    z-index: 101;
  }
  #wrapper.fix .head {
    /* position: fixed; */
    /* top: 71px; */
    width: 100%;
    z-index: 1000;
    left: 0;
    right: 0;
  }
  #wrapper.fix header {
    z-index: 999;
    position: relative;
  }
  #wrapper.fixed .head {
    top: 0;
  }
  #gnav .head .logo {
    width: 55px;
    padding: 7px 0 0 7px;
    float: left;
  }
  #gnav .menu {
    position: absolute;
    background: #5a4882;
    height: 100%;
    width: 100%;
    z-index: 100;
    overflow: scroll;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 0;
    box-sizing: border-box;
    display: none;
  }
  #gnav.fixed .menu {
    position: fixed;
    height: 100% !important;
    padding-bottom: 140px;
    top: calc(71px + 70px);
  }
  #wrapper.fix .menu {
    /* position: fixed; */
    position: absolute;
    /* height: 100% !important; */
    height: 100vh !important;
    /* padding-bottom: 140px; */
    padding-bottom: 1px;
    top: 14vw;
  }
  #wrapper.fixed .menu {
    padding-bottom: 70px;
    top: 14.062vw;
  }
  #gnav p.menuBtn {
    width: 24.74vw;
    height: 8.854vw;
    float: right;
    margin: 5.208vw 0 0 0;
    background: url(/-/Media/com/learn-more/eyecare2020/myopia/common/img/gnav-menu.png);
    background-size: 100%;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
  }
  #gnav p.menuBtn.open {
    background-image: url(/-/Media/com/learn-more/eyecare2020/myopia/common/img/gnav-close.png);
  }
  #gnav ul.bnr {
    padding: 10px 20px 20px;
    box-sizing: border-box;
  }
  #gnav ul.bnr li {
    margin-top: 10px;
  }
  #gnav p.close {
    background: #520100;
    text-align: center;
  }
  #gnav p.close img {
    width: 100px;
    padding: 24px 0;
    margin: 0 auto;
  }
  #gnav .sp a span img {
    width: 100%;
  }

/*-----------
	MV
-----------*/
.section_vi_bg{
  padding-top: 1.823vw;
}
.section_vi .inner{
	width: 100%;
}

.cnt_vi01 {
    height: auto;
}
.cnt_vi01 img{
    position: relative;
    margin: 0;
    left: 0;
    max-width: 100%;
}
/*-----------
lnv
-----------*/

.list_lnv li a {
    
}
.list_lnv li {
    padding-bottom: 3.2552vw;
    padding-top: 3.2552vw;
    font-size: 3.9063vw;
}

/*共通text style*/
.txt_wrap_01 p {
    line-height:2em;
    margin-bottom: 3.6458vw;
}
.txt-01 {
/*    background: url(/-/Media/com/learn-more/eyecare2020/myopia/common/img/bg-highlight01.png) repeat-x center 0.65em;*/
    background: url(/-/Media/com/learn-more/eyecare2020/myopia/common/img/bg-highlight01.png) repeat-x center 0.5em;
    font-weight: bold;
/*    background-size: 80%;*/
    background-size: 1000%;
}
.txt-02 {
    font-size: 3.6458vw;
}
.txt_chuui {
    font-size: 3.1250vw;
    color: #333;
}
/*ボタン*/
.btn-02 a,
.btn-03 a {
    font-size: 3.6458vw;
    background: url(/-/Media/com/learn-more/eyecare2020/myopia/common/img/ico-arrow01.png) no-repeat right 4vw center #5a4882;
    background-size: 1.5vw;
    padding-top: 1.3021vw;
    padding-bottom: 1.3021vw;
    padding-left: 4.1667vw;
    padding-right: 5.4688vw;
}
	
.slide-clm{
	padding: 11.719vw 0;
}
.slide-clm-02{
	background-color: #eee;
	padding: 9.1146vw 0 13vw;
	display: none;
	margin-bottom: 5.2vw;
}
.slide-btn-02{
	padding: 5.8vw 3.2vw;
	box-sizing: border-box;
	font-size: 3.9vw;
	margin-bottom: 2.6vw;
}
.slide-btn-02 .close,
.slide-btn-02 .open{
	padding-left: 7.8vw;
	min-height: 5.8vw;
}
.slide-btn-02 .open{
	background: url(/-/Media/com/learn-more/eyecare2020/myopia/common/img/ico_plus.png) no-repeat center left;
	background-size: 5.8vw;
}
.slide-btn-02 .close{
	background: url(/-/Media/com/learn-more/eyecare2020/myopia/common/img/ico_minus.png) no-repeat center left;
	background-size: 5.8vw;
}
.slide-btn-02::before{
	bottom: -1.3vw;
	width: 7.1vw;
	height: 7.1vw;
}
	
	.myopia_container .list-wrap-01{
		padding: 7.8125vw 5.2vw;
	}
	.myopia_container .list-wrap-01 .list-01 li{
		margin-bottom: 4.5573vw;
	}
	.myopia_container .list-wrap-01 .list-01 .list-ttl{
		height: 4.6875vw;
		padding-left: 9.1vw;
		margin-bottom: 3.2552vw;
	}
	.myopia_container .list-wrap-01 .list-01 .list-ttl::before{
		width:7vw;
		height: 7vw;
		background-size: 100%;
	}
	.myopia_container .list-wrap-01 .list-01 .list-ttl img{
		width:auto;
	}
	.myopia_container .list-wrap-01 .list-01 p{
		padding-left: 9.1vw;
	}

	
}
@media screen and (max-width: 480px) {

 /* -------------------------------------------------------------------------------------------------------------
	共通sp css
------------------------------------------------------------------------------------------------------------- */

}

/*共通・トップのテキストとアンカーリンクメニュー*/
.section_top-txt{
  padding: 11.458vw 0;
  font-size: 3.646vw;
  line-height: 1.8;
}
@media screen and (min-width: 769px) {
  .section_top-txt{
    padding: 58px 0;
    font-size: 2rem;
  }
}
.section_ankr-lnk{
  background-color: #eff0f7;
  padding: 2.64vw 0;
}
.section_ankr-lnk .ank-ul li a {
 color: #000; 
 padding: 2.64vw 7.8vw 2.64vw 0;
 display: block;
 background: url(/-/Media/com/learn-more/eyecare2020/myopia/common/img/ico_arrow.png) no-repeat right center;
 background-size: 4.4vw;
 font-size: 3.64vw;
}
@media screen and (min-width: 769px) {
  .section_ankr-lnk{
    padding: 30px 0 10px;
  }
  .section_ankr-lnk .ank-ul{
    display: flex;
    flex-wrap: wrap;
  }
  .section_ankr-lnk .ank-ul li{
    flex: 0 0 50%;
    align-items: center;
    margin-bottom: 20px;
  }
  .section_ankr-lnk .ank-ul li a {
   color: #000; 
   padding: 16px 25px 16px 0;
   background: url(/-/Media/com/learn-more/eyecare2020/myopia/common/img/ico_arrow.png) no-repeat right 0px center;
   background-size: 22px;
   font-size: 1.9rem;
  }
  .section_ankr-lnk .ank-ul li:nth-of-type(odd) a{
    border-right: 1px solid #dbdced;
    background-position: right 22px center;
  }
  .section_ankr-lnk .ank-ul li:nth-of-type(even) a{
    padding-left: 22px;
  }
  .section_ankr-lnk .ank-ul li a:hover{
    color: #58447f;
  }
}
.supervision_clm .cont .hos{
  display: inline-block; 
  padding-top: .5em;
}


.mb-0{margin-bottom: 0!important;}
.mb-1{margin-bottom: 1em!important;}
.mb-2{margin-bottom: 2em!important;}
.mb-3{margin-bottom: 3em!important;}
.mb-4{margin-bottom: 4em!important;}
.mb-5{margin-bottom: 5em!important;}
.mb-6{margin-bottom: 6em!important;}
/*別ページアンカーリンク*/
.scroll-target{
  scroll-margin-top: 13.8vw;
}
@media screen and (min-width: 769px) {
  .scroll-target{
    scroll-margin-top: 70px;
  }
}