@charset "utf-8";

br.sp { display: none; }
br.pc { display: block; }

.center { text-align: center !important; }
.right { text-align: right !important; }
.left { text-align: left !important; }

a.newTab { position: relative; padding-right: 18px !important; }
a.newTab:before,
a.newTab:after { content: ""; position: absolute; top: 2px; right: 2px; width: 12px; height: 9px; border: 1px solid #2a92d4; border-top-width: 2px; }
a.newTab:after { top: 4px; right: 0; border-top: none; border-left: none; }

/* color */

/* animation */
@-webkit-keyframes linkin  {
	0%   { -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); } 33%{ -webkit-transform: rotate(-20deg); -ms-transform: rotate(-20deg); transform: rotate(-20deg); }
	66%{ -webkit-transform: rotate(20deg); -ms-transform: rotate(20deg); transform: rotate(20deg); } 100% { -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); }
	}
@keyframes linkin          {
	0%   { -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); } 33%{ -webkit-transform: rotate(-20deg); -ms-transform: rotate(-20deg); transform: rotate(-20deg); }
	66%{ -webkit-transform: rotate(20deg); -ms-transform: rotate(20deg); transform: rotate(20deg); } 100% { -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); }
	}

@-webkit-keyframes vertical {
	0% { -webkit-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); } 100% { -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px); }
	}
@keyframes vertical {
	0% { -webkit-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); } 100% { -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px); }
	}


@media screen and (min-width: 771px){

header nav .tri > a:after { content: ""; display: inline-block; margin: 0 0 3px 7px; border: 4px solid transparent; border-top: 7px solid #1F3346; border-bottom: none; vertical-align: middle; }

header .current  a { color: #1F3346 !important; font-weight: bold; background: #FFF; border-bottom-color: #FFF; }
header .current:before { content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 3px; background: #007BC7; }
header nav .tri:after,
header .current:after { content: ""; display: block; position: absolute; bottom: -1px; left: 1px; width: 98%; width: calc(100% - 2px); height: 8px; background: #FFF; }
header nav .tri:after { opacity: 0; z-index: 100; }
header nav .tri:hover:after { opacity: 1; }
header nav .tri:hover > a:after { -webkit-transform: scale(1,-1); transform: scale(1,-1); }
header nav .tri:hover .subMenu { top: 53px; height: 109px; opacity: 1; }

header .subMenu { position: absolute; top: 46px; left: 0; height: 0; background: #FFF; box-shadow: 0 10px 15px rgba(213, 228, 239, 0.5); opacity: 0; overflow: hidden; z-index: 90; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; }
header .subMenu,
header .subMenu li { display: block; }
header .subMenu a { position: relative; padding: 15px 40px 16px 20px; font-size: 18px; font-weight: normal; text-align: left; border: 1px solid #CADCEA; border-top: none; white-space: nowrap; }
header .subMenu li:first-child a { border-top: 1px solid #CADCEA; }
header .subMenu a:after {
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	right: 0;
	margin: -10px 0 0;
	width: 12px;
	height: 20px;
	background: url("/images/arrowR.png") top left no-repeat;
	background-size: contain;
	opacity: 0;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
	}
header .subMenu a:hover { background: #F8FAFC; }
header .subMenu a:hover:after { right: 12px; opacity: 1; }
}

@media screen and (max-width: 1140px){

header { padding: 20px 0 35px; }
header h1 img { height: 40px; }
header #HeadBtns { top: -10px; font-size: 14px; }
header nav a { padding: 12px 25px; min-width: 140px; font-size: 17px; }
header nav .tri:hover .subMenu { top: 47px; }
header .subMenu { top: 40px; }
}

@media screen and (max-width: 770px){

br.sp { display: block; }
br.pc { display: none; }


/*-------------------------------------
	base
-------------------------------------*/

/* base */
html,
body { padding: 0; min-width: 375px; font-size: 15px; }

input[type="text"],
input[type="number"],
input[type="password"],
input[type="tel"],
input[type="email"],
input[type="url"],
select,
textarea { height: 34px; }

textarea { height: 100px; }

.select_box { min-width: 90px; }

/* header */
header { padding: 15px 0 50px; min-width: 375px; }
header h1 img { height: 34px; }
header #HeadBtns { top: 0; right: 15px; }
header #HeadBtns a { margin: 0 0 0 20px; font-size: 14px; }

header nav { right: 15px; bottom: -51px; }
header nav a { padding: 12px 20px; min-width: 130px; font-size: 16px; }

header .subMenu { display: none; }

#PageTop { right: 10px; bottom: 10px; }
#PageTop a {-webkit- transform: scale(0.8,0.8); transform: scale(0.8,0.8); -webkit-transform-origin: right bottom; transform-origin: right bottom; }

/* common */
.inner { padding: 0 15px; }

main { margin: 30px 0 90px; }

article h2 { font-size: 22px; }


/*-------------------------------------
	page
-------------------------------------*/

.form dt { width: 30%; }
.form dd { width: 70%; }
.form .label-list { width: calc(70% + 15px); }

.form input.LL { width: 220px; }
.form .label-list .label-group .M { width: 140px; }

.form.conf dt,
.form.conf dd { width: 40%; line-height: 1.4; }
.form.conf dd { width: 60%; }

.form.activity.conf dt { width: 40%; }
.form.activity.conf dd { width: 60%; }

.form.comp .inner { max-width: 80%; }

.acd { padding: 8px 34px 8px 18px; height: 34px; }
.acd:after { width: 8px; height: 14px; }

.modal.form label:not(:last-child) { margin-right: 20px; }
.modal.form .label-group label { margin: 0; }

.modal-block:not(.mini) { top: 7%; left: 5%; margin-left: 0 !important; width: 90%; max-height: 90%; }
.modal .modal-block:not(.mini) + .close { top: 7%; left: auto; right: 5%; margin-left: 0; }

.nohover .history-track { border-top: 1px solid #CADCEA; }

/* MypageTop */
.record.profile,
.record.activity,
#Info .half { margin: 0 0 30px !important; width: 100%; }
#Record .healthcare { border-bottom: 1px solid #CADCEA; }

.record.profile { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.record.profile h3,
.record.profile h3 + .right { width: 100%; }
.record.profile figure { padding: 20px 30px 20px 0; width: 40%; }
.record.profile dl { width: 60%; }
.record.profile dt,
.record.profile dd { padding: 15px 0; }
.record.profile dt:first-of-type,
.record.profile dd:first-of-type { border: none; }

.record .column dt,
.record .column dt.half { padding: 12px 15px 8px; width: 100%; }
.record .column dd,
.record .column dd.half { margin: 0; padding: 0 15px 12px; width: 100%; border: none; }

.record .column dd.data { padding: 10px; }
.record .column dd.data dt,
.record .column dd.data dd { padding: 5px 0; }

.record .leveled { padding-bottom: 12px !important; }
.record .leveled:before,
.record .leveled:after { top: 9px; -webkit-transform: translateX(10px); transform: translateX(10px); }
.record .leveled + dt { padding-top: 0; }

.nodata { padding: 20px; }
.nodata figure { margin: 0 0 10px; }
.record.activity .nodata img { margin: 0 auto; max-width: 25%; }

.news a,
.news .nolink { font-size: 16px; }
.news .nolink span { display: block; margin: 0 0 5px; }

/* Search */
#Search.form dd,
#Search.form dd.medium { width: calc(50% - 140px); }

#Average h3 { border: none; }
#Average .acd { height: auto; }
#Average .half { width: 100%; border-right: none; }
#Average .half .sp-scroll { margin: 0 auto; max-width: 480px; }
#Average .fourth { width: 50%; }
#Average .fourth:nth-of-type(2n) { border: none; }
#Average .fourth:nth-of-type(3),
#Average .fourth:nth-of-type(4) { border-bottom: 1px solid #CADCEA; }
#Average .fourth .sp-scroll { margin: 0 auto; max-width: 240px; }

#List li { width: 25%; }
#List li figure { width: 100px; height: 100px; }

.paging { -ms-flex-wrap: wrap; flex-wrap: wrap; }
.paging .number { border-bottom: 1px solid #CADCEA; }
.paging .pager li { width: 100%; }
.paging .pager li:first-child { border: none; }
.paging .pager li a { min-width: 0; line-height: 50px; }
.paging .pager img { height: 16px; }

#NoPage .inner { max-width: 80%; }
}

@media screen and (max-width: 600px){


/*-------------------------------------
	base
-------------------------------------*/

/* base */
body { font-size: 14px; }

label { margin-right: 20px; }

select { padding-right: 35px; }
.select_box { min-width: 0; }

button,
.btn { padding: 0 12px; min-width: 0; height: 34px; font-size: 15px; line-height: 33px; }

/* header */
header { padding: 15px 0 0; border: none; }
header .inner { padding: 0 10px; }
header h1 img { height: 26px; }

header #HeadBtns { top: -4px; right: 10px; }
header #HeadBtns a { margin: 0 0 0 15px; width: 32px; height: 32px; text-indent: 100%; background-position: center; border: 1px solid #999; border-radius: 5px; overflow: hidden; white-space: nowrap; }
header #HeadBtns a:hover { background-color: rgba(255,255,255,0.6); border-color: #007AC6; }

header nav { position: static; margin: 15px -10px 0; }
header nav .sp { display: none; }
header nav a { padding: 12px 15px; min-width: 0; font-size: 15px; }

header nav ul { width: 100%; }
header nav .tri > a { border-left: none; }
header nav li:last-child a { border-right: none; }

#PageTop a {-webkit- transform: scale(0.6,0.6); transform: scale(0.6,0.6);  }

footer #Copyright { font-size: 10px; }

/* common */
.inner { padding: 0; }

article { margin: 0 0 40px; }
article section { padding: 0; border: none; box-shadow: none !important; }

article h2 { font-size: 20px; }
article h2 span { font-size: 12px; }
article h3 { padding: 10px 15px; font-size: 17px; border-top: 1px solid #CADCEA !important; }
article h3 + .right { margin: -35px 0 12px !important; padding: 0 10px; }
article h3 + .right button,
article h3 + .right .btn { padding: 0 12px; min-width: 0; height: 28px; font-size: 13px; line-height: 25px; }


/*-------------------------------------
	page
-------------------------------------*/

.form form { padding: 10px 0; }
.form section > p { margin: 0 0 30px; padding: 0 15px; }

.form dt,
.form dd { margin: 0; padding: 0 15px; width: 100% !important; }
.form dd { margin: 0 0 10px; padding: 8px 15px 12px; border-bottom: 1px dashed #CADCEA; }
.form dt.required:after { right: 15px !important; }

.form input[type=radio] + span,
.form input[type=checkbox] + span { font-size: 16px; line-height: 30px; }
.form figure { width: 100px; height: 100px; }
.form input.LL { width: 190px; }
.form .label-list .label-group .M { width: 110px; }

.form .label-list { margin: 0 0 10px; }
.form .label-list > label,
.form .label-list .label-group { margin: 0; padding-right: 15px; min-width: 50%; }
.form .label-list input[type=radio] + span,
.form .label-list input[type=checkbox] + span { font-size: 15px; }

.form.conf form { padding: 0; }
.form.conf dl { border-top: 1px dashed #CADCEA; border-bottom: none; }
.form.conf dt,
.form.conf dd { padding: 10px 15px 8px !important; border-top: none; }
.form.conf dd { padding-top: 0 !important; }
.form.conf form p { margin-left: 0; margin-right: 0; }

.form.comp .inner { max-width: none; }
.form.comp section { padding: 0; }
.form.comp .dashed { margin: 0 15px; }

.lev-radio { margin: 0 auto; }

.large button,
.large .btn { padding: 0 20px; min-width: 140px; height: 48px; font-size: 18px; line-height: 48px; border-radius: 5px; }
.large + .left { margin: -20px 15px 0 !important; }

.modal-block h2 { padding: 0 15px; }
.modal.form dt { padding: 10px 15px; }
.modal.form dd { padding: 10px 15px; border-bottom: none; }
.modal.form table { margin: 0 0 10px; border: none; }
.modal.form th,
.modal.form td { display: block; padding: 10px 15px; width: 100%; border-right: none; }
.modal.form td { padding-top: 0; border-top: none; }
.modal.form .label-list > label,
.modal.form .label-list .label-group { margin: 0; padding: 0; }
.modal.form .label-list .label-group .M { width: 90px; }
.modal.form input.LL { width: 165px; }
.modal.form textarea { margin: 0; }
.modal.form .large button,
.modal.form .large .btn { min-width: 100px; height: 40px; font-size: 16px; letter-spacing: 1px; line-height: 38px; border-radius: 4px; }

.modal.average .w60,
.modal.average .w40 { padding: 0 15px 20px; width: 100%; border-left: none; }
.modal.average .w60 { padding: 0; overflow: auto; }
.modal.average .w60 .sp-scroll { padding: 0 15px 15px; min-width: 420px; }
.modal.average .w40 .sp-scroll { margin: 0 auto; max-width: 260px; }

.modal-block.mini { top: 7%; left: 5%; margin-left: 0 !important; width: 90%; max-height: 88%; }
.modal .modal-block.mini + .close { top: 7%; left: auto; right: 5%; margin-left: 0; }

.history-name { padding: 10px; font-size: 14px; }
.history-name + strong { padding: 10px 10px 0; font-size: 13px; }
.history-btns { right: 15px; }
.history-outline { padding: 0 10px 10px; font-size: 14px; }

.history-modal h2 { padding: 12px 10px; font-size: 15px; }
.history-modal table { display: block; }
.history-modal th,
.history-modal td { display: block; padding: 12px 10px 8px; width: 100%; font-size: 14px; border-right: none; }
.history-modal td { padding: 0 10px 12px; border-top: none; }
.history-modal th span { display: inline-block; margin: 0 0 0 5px; }

.nohover .history-group .balloon dt span { width: 16px; height: 16px; font-size: 13px; line-height: 16px; }

/* Box */
#Box main { padding: 40px 0 0; }
#Box form { padding: 10px 15px 20px; }
#Box h3 { padding: 15px 15px 0; border: none !important; }
#Box .dashed { padding: 20px; }
#Box .error,
#Box .message.success { padding: 20px 0 0; }

#Box.mail .left { margin: 20px 15px; }
#Box.login form { padding: 20px 15px; }
#Box.mail .error { padding: 15px 0 0; }

/* MypageTop */
#Record .inner,
#Info .inner,
.record.activity,
.record .column { display: block; }

.record.profile dt{ padding: 12px 0; width: 100px; }
.record.profile dd { padding: 12px 10px 12px 0; width: calc(100% - 100px); }
.record.profile figure { padding: 15px 20px 20px 15px; }

.record .column:before { display: none; }
.record .column dl { width: 100%; }
.record .column dl:first-child { border-bottom: 1px dashed #CADCEA; }
.record .column dt.half { padding: 12px 10px; width: 55%; }
.record .column dd.half { padding: 12px 10px; width: 45%; border-top: 1px dashed #CADCEA; }
.record .column dt.data { padding: 10px 30px 20px 20px; }
.record .column dd.data { padding: 15px 0; }

#Record .healthcare h3 + .right { margin: -34px 0 6px !important; }

#Info .graph { padding: 10px 0 0; overflow: auto; }
#Info .graph .sp-scroll { padding: 0 10px; min-width: 480px; min-height: 240px; }
#Info section .center { padding: 20px 0 0; }

.allcase table th,
.allcase table td { padding: 10px 15px; font-size: 14px; }

#News .news { border-top: 1px solid #CADCEA; }

.news li { border: none; border-bottom: 1px solid #CADCEA; }
.news a { padding: 15px 40px 15px 10px; }
.news .nolink { padding: 15px 10px; }
.news a:after { right: 8px; opacity: .2; }

.news-detail h3 { border-top: none !important; }
.news-detail p { margin: 10px 0; padding: 0 20px; }

.news.list a { padding: 10px 40px 10px 15px; }
.news.list a span { display: block; position: static; margin: 0 0 5px; padding: 0; }

/* Desease */
#Desease section { border-top: 1px solid #CADCEA; border-bottom: 1px solid #CADCEA; }
#Desease .nodata { padding: 20px; }
#Desease .nodata + .note { margin: -10px 0 0; }
#Desease .left { padding: 10px 15px; }
#Desease .history-name { padding: 12px 150px 12px 15px; }
#Desease .history-name:last-child { border-bottom: 1px solid #CADCEA; }
#Desease .history .history-track ~ .dashed { padding: 10px 15px; }
#Desease .note { font-size: 13px; }
#Desease .history ~ .note { padding: 0 15px 10px; }

/* Search */
#Search.form form { padding: 10px 0 0; }
#Search.form dl { margin: 0 0 9px; padding-left: 0 !important; }
#Search.form dt,
#Search.form dd { margin: 0; padding: 0 15px; width: 150px !important; border: none; }
#Search.form dd { padding: 6px 15px 6px 0; width: calc(100% - 150px) !important; }
#Search.form dt.required,
#Search.form dt.required + dd.long { padding: 6px 140px 6px 15px; width: 100% !important; }
#Search.form dt span { font-size: 12px; }
#Search.form .acd { top: 89px; right: 15px; }
#Search.form .acd-content { margin: 9px 0 14px; padding: 9px 0 0; }

#Average { border-bottom: 1px solid #CADCEA; }
#Average h3 span { font-size: 15px; }
#Average .acd-content { overflow: auto; }
#Average .acd-scroll { min-width: 480px; }

#Show { border-top: 1px solid #CADCEA; border-bottom: 1px solid #CADCEA; }

#List li { width: 33.33%; }
#List li a { padding: 20px 15px; }
#List li figure { width: 90px; height: 90px; }

.paging .number { padding: 10px 15px; }
.paging .pager li a { line-height: 40px; }
.paging .pager img { height: 14px; }

#NoPage section { padding: 0; }
}
