@charset "UTF-8";
/*-------------------------------------*/

body#top {
	min-width: 1100px;
}

header{
	position: relative;
	top: 15px;
}

#mainContents{ padding-top: 30px!important;}

div#lContents{
	float: left;
	width: 640px;
	position: relative;
}

div#rContents{
	width: 280px;
	float: right;
	position: relative;
}

.bgCheck{
	position: absolute;
	right: -10px;
	bottom: -10px;
	z-index: -1;
}

/*-------------------------------------*/

#gMapWrap{
	width: 636px;
	height: 350px;
	background: #ffffff;
	margin-bottom: 50px;
	position: relative;
}

#gMapWrap iframe{
	width: 616px;
	height: 329px;
	position: relative;
	top: 10px;
	left: 10px;
}

/*-------------------------------------*/

#secondBlock{
	width: 640px;
	position: relative;	
	text-align: center;
}

#secondBlock section#doctorWrap{
	width: 285px;
	float: left;
	background: url(../img/index/bg_roof.gif) no-repeat center top #ffffff;
	position: relative;	
	z-index: 10;
	padding-top: 100px;
}

#doctorInner{
	position: relative;
	top: -30px;
	text-decoration: none;
}

#doctorInner a{
	display: block;
	text-decoration: none;
}

#secondBlock section#doctorWrap h1{
	font-size: 14px;
	letter-spacing: 3px;
	padding-bottom: 20px;
	border-bottom: 2px solid #121212;
	width: 222px;
	text-align: center;
	margin: 0 auto 36px;
	color: #333333;
}

#secondBlock section#doctorWrap p{ margin-bottom: 20px;}

#secondBlock section#doctorWrap h2{
	font-size: 14px;
	letter-spacing: 3px;
	color: #EB6559;
	margin-bottom: 8px;
}

#secondBlock section#doctorWrap span{
	font-size: 11px;
	letter-spacing: 2px;
}

#secondBlock section#doctorWrap a.btnPink{
	position: absolute;
	background: #EB6559;
	color: #ffffff;
	padding: 8px 12px;
	bottom: 0;
	left: 0;
	font-size: 12px;
	text-decoration: none;
	letter-spacing: 2px;
}

#doctorWrap .character {
	position: absolute;
	top: 296px;
	right: -22px;
	width: 55px;
	height: auto;
	opacity: 0;
}

#doctorWrap .character.active {
	animation: doctorWrap .7s cubic-bezier(0.215, 0.61, 0.355, 1) forwards;
}

@keyframes doctorWrap {
	0% { right: -22px; transform: rotateZ(0); opacity: 0; }
	30% { right: 28px; transform: rotateZ(-5deg); opacity: 1; }
	60% { margin-top: 0; right: 18px; transform: rotateZ(0); }
	85% { margin-top: -20px; right: 18px; }
	100% { margin-top: 0; right: 18px; opacity: 1; }
}

/*-------------------------------------*/

div#lContents h1 a{
	color: #333333;
	text-decoration: none;
}

div#lContents h1 a:hover{ text-decoration: underline;}

#secondBlock section#topics{
	width: 237px;
	float: right;
	background: #ffffff;
	z-index: 10;
	padding: 40px 30px 0px;
	position: relative;
	top: 24px;
}

#secondBlock section#topics h1{
	text-align: left;
	font-size: 14px;
	letter-spacing: 1px;
	padding: 0px 0 30px 2px;
	margin-bottom: 30px;
	border-bottom: 2px solid #121212;
	color: #333333;
}

#secondBlock section#topics article{
	text-align: left;
	margin-bottom: 16px;
	padding-bottom: 18px;
	border-bottom: 1px dotted #999999;
	padding-left: 2px;
}

#secondBlock section#topics article:last-child{
	padding-bottom: 0;
	margin-bottom: 0;
	border: none;
	background: #c00;
}

#secondBlock section#topics article span{
	font-size: 9px;	
	letter-spacing: 1px;
	display: block;
	padding-bottom: 10px;
	color: #999999;
	
}

#secondBlock section#topics article strong{
	font-size: 12px;
	letter-spacing: 1px;
	line-height: 1.6;
	
}

#secondBlock section#topics article strong a{
	display: block;
  width: 235px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;

}

/*-------------------------------------*/
/* div#rContents{} */
/*-------------------------------------*/

div#tableWrap{
	padding-top: 6px;
	margin-bottom: 30px;
}

div#tableWrap table{
	width: 280px;
	background: #ffffff;
	margin-bottom: 8px;
}

div#tableWrap table th,
div#tableWrap table td{
	padding: 4px 3px;
	font-size: 11px;
	line-height: 2;
/* 	letter-spacing: 2px; */
	text-align: center;
	font-family: 'Montserrat', sans-serif;	
}

div#tableWrap table th{
	background: #AFDAD3;	
	color: #ffffff;
	border-left: 1px solid #ffffff;
	border-bottom: 1px solid #ffffff;	
}

div#tableWrap table td{
	color: #666666;
	border-left: 1px solid #dddddd;
	border-bottom: 1px solid #dddddd;
	font-size: 12px;
}

div#tableWrap table th.hour,
div#tableWrap table td.time{
	padding: 0 8px!important;
	margin: 0!important;
	letter-spacing: 2px;
	text-align: left!important;
	width: 85px;	
	
}

div#tableWrap table th.hour{
	font-size: 12px!important;
}

div#tableWrap table td.time{
	font-size: 11px!important;
	font-family: 'Montserrat', sans-serif;	
}

div#tableWrap table th:first-child{
	text-align: left;
	padding-left: 20px;
	letter-spacing: 4px;
}

div#tableWrap table td:first-child{
	text-align: left;
	padding-left: 20px;
	font-size: 11px;
}

div#tableWrap table th:last-child{
	border-right: 1px solid #AFDAD3;	
}

div#tableWrap table td:last-child{
	border-right: 1px solid #dddddd;
}

div#tableWrap span.txtS{
	font-size: 11px;
	letter-spacing: 1px;
	line-height: 1.8;
	color: #666666;
}

/*-------------------------------------*/

div#rContents ul li{
	display: block;
	margin-bottom: 20px;
}

div#rContents ul li span{
	display: block;
	margin-top: 9px;
	font-size: 12px;
	letter-spacing: 0.1em;
	line-height: 1.7;
}

.bnr-about,
.bnr-virus {
	position: relative;
}

.bnr-about .bg {
	position: relative;
	display: block;
}

.bnr-about .bg:first-of-type:after {
	display: block;
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	background: #FCF8E4;
	width: 279px;
	height: 140px;
	z-index: 1;
}

.bnr-about a:hover {
	opacity: 1 !important;
}

.bnr-about a:hover img:first-of-type {
	opacity: 0.5;
}

.bnr-about img {
	position: relative;
	z-index: 2;
}

.bnr-about .character {
	position: absolute;
	top: 17px;
	right: -22px;
	width: 77px;
	height: auto;
	z-index: 0;
	transition: .08s ease-out;
}

.bnr-about a:hover .character {
	margin-right: -23px;
	animation: bnr-about .3s linear forwards;
}

@keyframes bnr-about {
	0% { right: -22px; }
	20% { right: -26px; }
	40% { right: -18px; }
	60% { right: -24px; }
	80% { right: -20px; }
	100% { right: -22px; }
}

.bnr-virus .character {
	position: absolute;
	top: 16px;
	left: 15px;
	width: 54px;
	height: auto;
	transform: rotate(7deg);
	animation: bnr-virus 2s linear infinite;
}

@keyframes bnr-virus {
	0% { margin-top: 0; }
	6% { margin-top: 3px; }
	12% { margin-top: 0; }
	18% { margin-top: 3px; }
	24% { margin-top: 0; }
	100% { margin-top: 0; }
}

.bnr-virus a {
	display: block;
}

.bnr-virus a img:first-of-type {
	width: 100%;
	height: auto;
}

div.fb-like-box{
	margin: 0 auto;
	background: #ffffff;
	padding: 10px;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
/* 	border: 1px solid #dedede; */
}

.link-nodoca {
	margin-top: 20px;
}

.link-nodoca a {
	color: #EB6559;
	font-size: 12px;
	font-weight: bold;
	letter-spacing: 0.1em;
	line-height: 1.7;
}


/*-------------------------------------*/

p#flag1{
	position: absolute;
	left: -40px;
	top: 336px;
	z-index: 9999;
}

p#flag2{
	position: absolute;
	left: -130px;
	top: -40px;
	top: 410px;
	z-index: 9999;
}

/*-------------------------------------*/

/*footer{
	padding-top: 100px;
}*/

/*-------------------------------------*/

/* common */
.stage{
	width: 1020px;
	margin: 0 auto;
}

/* #top-main
---------------------------------------------------------------------------*/
#top-main {
	position: relative;
	background: #FFFFFF;
	width: 100%;
	height: 625px;
	margin-bottom: 95px;
}

.top-main-inner {
	position: relative;
	width: 1100px;
	margin: 0 auto;
}

#top-main img {
	display: block;
}

/* .face-set
------------------------------------*/
#top-main .face-set {
	position: absolute;
	top: 0;
	left: -8px;
	width: 690px;
}

/* #top-main .face-set - media query
-----------------------------------*/
@media (max-width: 1140px) {
	#top-main .face-set { left: 5px; }
}

#top-main .face-set span {
	display: block;
	position: absolute;
}

#top-main .face-set span img {
	width: 100%;
	height: auto;
}

#top-main .face-set .purple { top: -25px; left: 0; width: 324px; transform: rotate(1deg); z-index: 10000; }
#top-main .face-set .purple.zindex { z-index: 10; }

#top-main .face-set .green { top: 362px; right: 0; width: 298px; transform: rotate(2deg); z-index: 4; }
#top-main .face-set .orange { top: 65px; right: 25px; width: 240px; transform: rotate(22deg); z-index: 3; }
#top-main .face-set .yellow { top: 404px; left: 94px; width: 234px; transform: rotate(7deg); z-index: 2; }
#top-main .face-set .blue { top: 239px; left: 265px; width: 188px; transform: rotate(14deg); z-index: 1; }
#top-main .face-set .word2 { top: 306px; left: 52px; width: 181px; height: auto; z-index: 1; }
#top-main .face-set .word3 { top: 305px; right: 0; width: 191px; height: auto; z-index: 1; }

#top-main .face-set .purple img,
#top-main .face-set .green img,
#top-main .face-set .orange img,
#top-main .face-set .yellow img,
#top-main .face-set .blue img { transform: scale(0); }

#top-main .face-set .purple img { transform-origin: right bottom; }
#top-main .face-set .green img { transform-origin: left top; }
#top-main .face-set .orange img { transform-origin: left bottom; }
#top-main .face-set .yellow img { transform-origin: right top; }
#top-main .face-set .blue img { transform-origin: center center; }

#top-main.active .face-set .purple img { animation: face-set-purple .8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s forwards; }
#top-main.active .face-set .green img {  animation: face-set-green  .8s cubic-bezier(0.215, 0.61, 0.355, 1) .1s forwards; }
#top-main.active .face-set .orange img { animation: face-set-orange .8s cubic-bezier(0.215, 0.61, 0.355, 1) .2s forwards; }
#top-main.active .face-set .yellow img { animation: face-set-yellow .8s cubic-bezier(0.215, 0.61, 0.355, 1) .3s forwards; }
#top-main.active .face-set .blue img {   animation: face-set-blue   .8s cubic-bezier(0.215, 0.61, 0.355, 1) .4s forwards; }

@keyframes face-set-purple {
	0%   { transform: scale(0); }
	50%  { transform: scale(1.1); }
	100% { transform: scale(1); }
}
@keyframes face-set-green {
	0%   { transform: scale(0); }
	50%  { transform: scale(1.1); }
	100% { transform: scale(1); }
}
@keyframes face-set-orange {
	0%   { transform: scale(0); }
	50%  { transform: scale(1.05); }
	100% { transform: scale(1); }
}
@keyframes face-set-yellow {
	0%   { transform: scale(0); }
	50%  { transform: scale(1.05); }
	100% { transform: scale(1); }
}
@keyframes face-set-blue {
	0%   { transform: scale(0); }
	50%  { transform: scale(1.05); }
	100% { transform: scale(1); }
}

#top-main .face-set .word2,
#top-main .face-set .word3 {
	opacity: 0;
}

#top-main .face-set .word2 {
	transform-origin: right bottom;
	transform: scale(0); 
}
#top-main .face-set .word3 {
	transform-origin: left bottom;
	transform: scale(0); 
}

/*#top-main.active .face-set .word2 { animation: face-set-word2 .6s cubic-bezier(0.165, 0.84, 0.44, 1) .5s forwards; }
#top-main.active .face-set .word3 { animation: face-set-word3 .6s cubic-bezier(0.165, 0.84, 0.44, 1) .6s forwards; }*/
#top-main.active .face-set .word2 { animation: face-set-word2 .6s cubic-bezier(0.165, 0.84, 0.44, 1) .5s forwards; }
#top-main.active .face-set .word3 { animation: face-set-word3 .6s cubic-bezier(0.165, 0.84, 0.44, 1) .6s forwards; }

@keyframes face-set-word2 {
	0%   { margin-top: -40px; margin-left: 80px; transform: scale(0); opacity: 0; }
	100% { margin-top: 0px; margin-left: 0; transform: scale(1); opacity: 1; }
}
@keyframes face-set-word3 {
	0%   { margin-top: 40px; margin-left: -80px; transform: scale(0); opacity: 0; }
	100% { margin-top: 0px; margin-left: 0; transform: scale(1); opacity: 1; }
}


/* .character-set
------------------------------------*/
#top-main .character-set-wrap {
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 625px;
}

#top-main .character-set {
	position: absolute;
	top: 0;
	right: 53px;
	width: 275px;
	padding-top: 440px;
}

/* #top-main .character-set - media query
-----------------------------------*/
@media (max-width: 1140px) {
	#top-main .character-set { right: 75px; }
}

#top-main .character-set .word1 {
	opacity: 0;
}

#top-main .character-set .word1:nth-of-type(1) { position: absolute; top: 73px; left: 8px; }
#top-main .character-set .word1:nth-of-type(2) { position: absolute; top: 120px; right: -32px; transform: rotate(70deg); }

#top-main .character {
	display: block;
	position: absolute;
	top: 96px;
	left: 46px;
	width: 199px;
	height: auto;
	margin-top: 600px;
	transform-origin: center center;
	transform: scale(0.8);
}

#top-main .character-eye {
	position: absolute;
	top: 110px;
	left: 59px;
	width: 71px;
	height: auto;
}

#top-main .character-set h2 {
	margin-bottom: 23px;
}

#top-main .character-set h2,
#top-main .character-set p {
	text-align: center;
	opacity: 0;
}

#top-main .character-set h2 img,
#top-main .character-set p img {
	display: inline;
}

/* .character-set .character 
------------------------------------*/
#top-main.active .character-eye {
	animation:
		/*top-character-eye1 .6s linear 1.4s forwards,
		top-character-eye2 .8s linear 2.4s forwards;*/
		top-character-eye1 .6s linear .4s forwards,
		top-character-eye2 .8s linear 1.4s forwards;
}

#top-main.active .character {
	animation:
		/*top-character1 .3s cubic-bezier(0.165, 0.84, 0.44, 1) 1s forwards,
		top-character2 1s cubic-bezier(0.645, 0.045, 0.355, 1) 2.4s forwards,
		top-character3 .7s cubic-bezier(0.645, 0.045, 0.355, 1) 3.3s forwards,
		top-character4 .3s linear 4s forwards;*/
		top-character1 .3s cubic-bezier(0.165, 0.84, 0.44, 1) 0s forwards,
		top-character2 1s cubic-bezier(0.645, 0.045, 0.355, 1) 1.4s forwards,
		top-character3 .7s cubic-bezier(0.645, 0.045, 0.355, 1) 2.3s forwards,
		top-character4 .3s linear 3s forwards;
}

@keyframes top-character-eye1 {
	0%   { margin-top: 0; margin-left: 0; }
	25%  { margin-top: -2px; margin-left: -2px; }
	50%  { margin-top: 0; margin-left: -4px; }
	75%  { margin-top: -2px; margin-left: -2px; }
	100% { margin-top: 0; margin-left: 0; }
}
@keyframes top-character-eye2 {
	0%   { margin-left: 0; }
	60%  { margin-left: -4px; }
	100% { margin-left: 0; }
}

@keyframes top-character1 {
	0%   { margin-top: 500px; transform: scale(0.8); }
	100% { margin-top: 385px; transform: scale(0.7); }
}
@keyframes top-character2 {
	0%   { margin-top: 385px; transform: scale(0.7); }
	20%  { margin-top: 425px; transform: scale(0.7); }
	65%  { margin-top: -40px; transform: scale(1.2); }
	80%  { margin-top: 0px; transform: scale(1); }
	90%  { margin-top: -5px; transform: scale(1); }
	100% { margin-top: 0; transform: scale(1); }
}
@keyframes top-character3 {
	0%   { margin-left: 0; transform: rotateZ(0deg); transform-origin: center bottom; }
	10%  { margin-left: -10px; transform: rotateZ(-2deg); transform-origin: center bottom; }
	25%  { margin-left: -20px; transform: rotateZ(3deg); transform-origin: center bottom; }
	40%  { margin-left: -10px; transform: rotateZ(-2deg); transform-origin: center bottom; }
	50%  { margin-left: 10px; transform: rotateZ(2deg); transform-origin: center bottom; }
	65%  { margin-left: 20px; transform: rotateZ(-3deg); transform-origin: center bottom; }
	80%  { margin-left: 10px; transform: rotateZ(2deg); transform-origin: center bottom; }
	100% { margin-left: 0; transform: rotateZ(0deg); transform-origin: center bottom; }
}
@keyframes top-character4 {
	0%   { margin-top: 0; transform: rotateY(0deg); }
	50%  { margin-top: -60px; transform: rotateY(180deg); }
	100% { margin-top: 0; transform: rotateY(360deg); }
}

/* .character-set .word
------------------------------------*/
#top-main.active .character-set .word1:nth-of-type(1) {
	/*animation: character-word1 .3s cubic-bezier(0.165, 0.84, 0.44, 1) 3.4s forwards;*/
	animation: character-word1 .3s cubic-bezier(0.165, 0.84, 0.44, 1) 2.4s forwards;
}
@keyframes character-word1 {
	0%   { margin-top: 40px; margin-left: 20px; opacity: 0; }
	50%  { margin-top: -10px; margin-left: -5px; opacity: 1; }
	100% { margin-top: 0; margin-left: 0; opacity: 1; }
}

#top-main.active .character-set .word1:nth-of-type(2) {
	/*animation: character-word2 .3s cubic-bezier(0.165, 0.84, 0.44, 1) 3.8s forwards;*/
	animation: character-word2 .3s cubic-bezier(0.165, 0.84, 0.44, 1) 2.8s forwards;
}
@keyframes character-word2 {
	0%   { margin-top: 15px; margin-right: 30px; opacity: 0; }
	50%  { margin-top: -5px; margin-right: -10px; opacity: 1; }
	100% { margin-top: 0; margin-right: 0; opacity: 1; }
}

/* .character-set h2,p
------------------------------------*/
#top-main.active .character-set h2 {
	/*animation: character-h2 .5s cubic-bezier(0.215, 0.61, 0.355, 1) 4.2s forwards;*/
	animation: character-h2 .5s cubic-bezier(0.215, 0.61, 0.355, 1) 3.2s forwards;
}
@keyframes character-h2 {
	0%   { margin-left: -100px; opacity: 0; }
	100% { margin-left: 0; opacity: 1; }
}

#top-main.active .character-set p {
	/*animation: character-p .5s cubic-bezier(0.215, 0.61, 0.355, 1) 4.3s forwards;*/
	animation: character-p .5s cubic-bezier(0.215, 0.61, 0.355, 1) 3.3s forwards;
}
@keyframes character-p {
	0%   { margin-left: -100px; opacity: 0; }
	100% { margin-left: 0; opacity: 1; }
}


/*-------------------------------------*/

#flagL1{
	position: absolute;
	left: 0;
	top: -180px;
}

#flagL2{
	position: absolute;
	right: 0;
	top: -180px;
}

.boxLink{
	cursor: pointer;
}

.boxLink:hover{
	filter: alpha(opacity=60);
	-moz-opacity:0.60;
	opacity:0.60;
}