/* -----------------------------------------------------------
 富山大学第３内科　追加機能 css
 File name: function.css
----------------------------------------------------------- */
/* ----------------------------------------------
	Header (L-size)
------------------------------------------------*/
/* Header size
----------------------------*/
header{
	width 		: 100%;
	height		: 86px;
	top   		: 0;
	right  		: auto;
	background   	: #fff;}

/* Logo definition
----------------------------*/
#logo {	
	margin		: 10px 20px 10px 20px; 	/* 9px 20px */
 	float 		: left;
	width		: 30%;
      max-width		: 576px; 			/* 横幅の最大値 */
	height		: 74%;  			/* 80% */
	background	: url(../img/bar/logol.png) no-repeat left / 80%;
	display		: block;}

#logo:hover{
	opacity		: .65;}


/* Logo-right definition
----------------------------*/
.logor{
	margin		: 10px 20px 0 0;
	float 		: right;
	width		: 12%;
      max-width		: 200px; 			/* 横幅の最大値 */
	height		: 70%;
	background	: url(../img/bar/login.png) no-repeat center / 90%;
	display		: block;}

.logot{	
	margin		: 10px 20px 0 0;
	float 		: right;
	width		: 12%;
      max-width		: 200px; 			/* 横幅の最大値 */
	height		: 70px;
	background	: url(../img/bar/logout.png) no-repeat center / 90%;
	display		: block;}

.home {
	margin		: 10px 20px 0 0;
	float 		: right;
	width		: 12%;
      max-width		: 200px; 			/* 横幅の最大値 */
	height		: 70%;
	background	: url(../img/bar/home.png) no-repeat center / 90%;
	display		: block;}

.logor:hover, .home:hover{
	opacity		: .35;}


/* ----------------------------------------------
	Grobal Navigation
------------------------------------------------*/
/* main menu (navDrawr)
----------------------------*/
.navDrawr>ul:after {
    	content		: ".";
    	display		: block;
    	clear		: both;
    	height		: 0;
    	visibility	: hidden;}
.navDrawr>ul>li {
    	float		: left;
    	width		: 25%;			/* ４等分(25%) */
    	position	: relative;}
.navDrawr a {
    	display		: block;
    	padding		: 10px;			/* 帯文字 上下  */
    	text-decoration	: none;
	text-align	: center;
	font-size	: 18px;			/* 帯文字サイズ */
    	color		: #000;			/* 帯の文字の色 */
    	background	: #ffffff;		/* 帯 の 背景色 1B73BA */
	border-top	: 1px solid #ffffff;
    	border-bottom	: 3px solid #1B73BA;}	/* Border線定義 */
.navDrawr .sub li:last-child a {
    	border		: none;}
.navDrawr>ul>li>a {
    	border-left	: 1px dashed #cfcfcf;	/* 縦の区切り線色 #cfcfcf */
    	text-align	: center;}
.navDrawr>ul>li:last-child>a {
	border-right	: 2px solid #ffffff;}	/* 右端区切り線色 */
.navDrawr>ul>li>a:hover{
    	color		: #036;			/* hover時の文字の色 */
    	background	: #e7f8f7;}		/* その背景色(hover) */
.navDrawr .sub {
    	position	: absolute;
    	left		: 0;
   	right		: 0;
    	z-index		: 101;}
.navDrawr .sub a {
    	color		: #fff;			/* ドロワーの文字色 */
    	background	: #305ea9;		/* ドロワーの背景色 */
    	border-bottom	: 1px solid #cfcfcf;
    	padding		: 10px 10px 10px 20px;}
.navDrawr .sub a:hover {
	background	: #c14646;}


/* smart phone setting
-----------------------*/
@media screen and (max-width: 960px) {
.navDrawr {
        background-color: #666;
        position	: fixed;
        width		: 270px;
        top		: 56px;			/* メニュー上端位置 */
        bottom		: 0;
        right		: -270px;
        overflow	: auto;
        -webkit-overflow-scrolling: touch;}
body.menuOpen #wrapper{
        padding-top	: 60px;}
.overlay {
        display		: none;
        background-color: rgba(0,0,0,0.49);
        position	: fixed;
        top		: 0;
        bottom		: 0;
        left		: 0;
        right		: 0;}
header{	position	: fixed;
        height		: 60px;
        padding		: 0;}
body.menuOpen header{
        position	: fixed;
        top		: 0;
        width		: 100%;}
header .headerTop{	
        padding		: inherit;}
header .siteTitle a{
        margin-left	: 20px;
        line-height	: 60px;}
.navDrawrBtn {
        text-align	: right;}
.navDrawrBtn span {
        position	: fixed;
        top		: 4px;
        right		: 0px;
        margin		: auto;
        display		: block;
        width		: 46px;
        height		: 50px;
        cursor		: pointer;}
.navDrawrBtn span::before {
        font-family	: FontAwesome;
        content		: "\f0c9";
        font-size	: 36px;
        color		: #01579B;
        position	: absolute;
        left		: 0;
        width		: 100%;
        text-align	: center;
        line-height	: 60px;}
body.menuOpen .navDrawrBtn span::before {
        content		: "\f00d";}
.navDrawr a {
	text-align	: left;
        position	: relative;
    	color		: #000;			/* 帯の文字の色 */
    	background	: #e7f8f7;}		/* 帯 の 背景色 */
.navDrawr a::after {
        position	: absolute;
        top		: 50%;
        margin-top	: -10px;
        right		: 15px;
        font-family	: FontAwesome;
        content		: "\f054";}
.navDrawr>ul>li {
        float		: none;
        width		: auto;}
.navDrawr>ul>li>a {
        text-align	: left;
        border-right	: none;
        border-bottom	: 1px solid #900000;}
.navDrawr .sub {
        position		: static;
        display		: block!important;}
ul.imgList{}
ul.imgList::after{
    	display		: table;
    	line-height	: 0;
    	content		: "";
    	clear		: both;}
ul.imgList li{
    	float		: left;
   	width		: 31.3%;
    	margin		: 1%;}
ul.imgList li .thumbnail{
    	background-color: #FFF;
    	padding		: 20px;
    	border		: solid 1px #ccc;
   -webkit-border-radius: 8px;
   -moz-border-radius   : 8px;
    	border-radius	: 8px;}
ul.imgList li img{
    	margin-bottom	: 10px;}
ul.imgList li .caption{}
ul.imgList li .title{
    	font-size	: 24px;
    	font-weight	: bold;
    	margin-bottom	: 10px;}
}



/* Navi_fixed		: 	画面上部でナビゲーションメニューを固定
----------------------------*/
#global-nav {
	clear		: both;
	top		: 100px;
	width		: 100%;
	z-index      	: 100;}

#global-nav.m_fixed {
  	position	: fixed;
  	top		: 0;
	opacity		: .97;}


/* ----------------------------------------------
	h1-h5 タグ定義
------------------------------------------------*/
h1{	position	: absolute;
	padding		: 5px 2px;
	font-size	: 0em;
	color		: #1B73BA;}

h2{
	font-weight	: 500;
  	position	: relative;
  	padding		: .75em 1em .75em 1.55em;
	border-bottom	: 1px solid #1B73BA;
  	font-size	: 32px;
  	margin		: 0 0 20px;
  	padding-bottom	: 5px;}
h2::after{
  	position	: absolute;
  	top		: 0.95em;
  	left		: .3em;
  	z-index		: 1;
  	content		: ' ';
  	width		: 28px;
  	height		: 28px;
  	border		: 2px solid #1B73BA;
  	border-radius	: 100%;}

h3{	border-left	: 6px solid #1B73BA;
	color		: #1B73BA;
  	font-size	: 22px;
  	font-weight	: 600;
  	margin		: 0 0 10px;
  	padding-left	: 5px;}
h3 p{	font-weight	: 500;}

h4{	width		: 90%;
	position	: relative;
	padding		: 12px 10px;
	font-size	: 16px;
  	font-weight	: 500;
	margin		: 2em 0 0.5em 2em;
	border		: 1px solid #c14646;}
h4::after{
	content		: "POINT";
	position	: absolute;
	top		: -8px;
	left		: 10px;
	background	: #fff;
	font-size	: 12px;
	color		: #c14646;
	padding		: 0 10px;}

h5{	position	: relative;
	padding		: 20px 65px;
	text-align	: center;
	font-size	: 30px;}
h5:before {
  	position	: absolute;
  	top		: calc(50% - 1px);
  	left		: calc(10% - 1px);
  	width		: 80%;
  	height		: 2px;
  	content		: '';
  	background	: #1B73BA;} /* #1B73BA */
h5 span{position	: relative;
  	padding		: 0 1em;
  	background	: rgba(255,255,255,1);}

h6{	background	: linear-gradient(transparent 60%, #c1e0ff);
	font-size	: 20px;}

/* smart phone setting
-----------------------*/
@media screen and (max-width: 960px) {
h2 {	font-size	: 24px; }
h2::after{
  	width		: 22px;
  	height		: 22px;}
h3{	border-left	: 6px solid #1B73BA;
  	font-size	: 20px;}
h4 {	width		: 96%;
	margin-left	: 0.6em;
	margin-right	: 0.6em;}
h5 {	font-size	: 26px; }
h5:before {
  	left		: calc(5% - .1px);
	width		: 90%;  }
h6 {	font-size	: 22px; }
}


/* ----------------------------------------------
	Tables
------------------------------------------------*/
table{
	width  		: 100%;
	border-collapse	: collapse;
	table-layout 	: fixed;
	line-height	: 115%;
	padding		: 10px 5px;
  	border		: solid 1px #ddd;}

td{	word-wrap	: break-word;
  	white-space	: normal;}

.shyo table{
	border		: 0 20px;}


/* ----------------------------------------------
	Slider Tables
------------------------------------------------*/
.scroll {overflow-y		  :      hidden; white-space	  	  :nowrap;	margin-top    :  10px;   	       	}

.res	{border: solid 1px #e1e1e1; width:950px; margin-left : 5px;				               	 		}
.jun	{border: solid 1px #e1e1e1; width:440px; height: 45px; text-align:center;	vertical-align:middle; 	font-size:16px;	}
.bil 	{border: solid 1px #e1e1e1; width:225px;      		 text-align:center; 	vertical-align:middle;	font-size:14px;	}
.hsp	{border: solid 1px #e1e1e1; width:180px; 			 text-align:center; 	vertical-align:middle; 	font-size:14px;}
.nam 	{border: solid 1px #e1e1e1; width:180px;       		 text-align:center; 	vertical-align:middle;	font-size:14px;	}
.add	{border: solid 1px #e1e1e1; width:120px; 			 text-align:center; 	vertical-align:middle; 	font-size:14px;}
.day	{border: solid 1px #e1e1e1; width:100px; height: 60px; text-align:center; 	vertical-align:middle; 	font-size:14px;	}
.pac	{border: solid 1px #e1e1e1; width:100px; height: 45px; text-align:center; 	vertical-align:middle; 	font-size:14px;	}
.gai	{border: solid 1px #e1e1e1; width:100px; height: 45px; text-align:center; 	vertical-align:middle; 	font-size:16px;	}
.obn	{border: solid 1px #e1e1e1; width: 80px;			 text-align:center;	vertical-align:middle;  font-size:14px;}
.bed	{border: solid 1px #e1e1e1; width: 60px; 			 text-align:center;	vertical-align:middle;  font-size:14px;}
.gao	{border: solid 1px #e1e1e1; width:440px; height: 45px; text-align:left  ;	vertical-align:middle; 	font-size:16px;	}
.spe	{border: solid 1px #e1e1e1; width:440px; padding: 8px; text-align:left  ;	vertical-align:middle;  font-size:14px;	}
.paf	{border: solid 1px #e1e1e1; width:100px; height: 45px; text-align:left  ; 	vertical-align:middle; 	font-size:14px;	}
.trn	{			    width: 60px; height: 45px; text-align:center;            	 	                       	}
.stf	{			    width: 60px; 										}


/* smart phone setting
-----------------------*/
@media screen and (max-width: 960px) {		/* smart phone */
.pac	{border: solid 1px #e1e1e1; width:100px; height: 32px; text-align:center; 	vertical-align:middle; 	font-size:14px; }
.paf	{border: solid 1px #e1e1e1; width:100px; height: 32px; text-align:left  ; 	vertical-align:middle; 	font-size:14px; }
}


/* ----------------------------------------------
	iflame フォーマット
------------------------------------------------*/
.form{	position	: relative;
	height		: 350px;
	width		: 100%;}

.form iframe{
	frameborder	: 0;
	scrolling	: no;
    	position	: absolute;
	background-color: transparent;}

/* smart phone setting
-----------------------*/
@media screen and (max-width: 960px) {		/* smart phone */
.form{	height		: 400px;}
}


/* ----------------------------------------------
	Fadein Animation
------------------------------------------------*/
.fadedw {					/* Down in */
	opacity 	: 0;
    	transform 	: translate(0, 200px);
    	transition 	: all 650ms;}

.fadedw.scrollin {
    	opacity 	: 1;
    	transform 	: translate(0, 0);}

.fadelr {					/* L->R slide in */
	opacity 	: 0;
    	transform 	: translate(-300px, 0);
    	transition 	: all 650ms;}

.fadelr.scrollin {
    	opacity 	: 1;
    	transform 	: translate(0, 0);}

/* smart phone setting
-----------------------*/
@media screen and (max-width: 960px) {		/* smart phone */
.fadedw {					/* Down in */
	opacity 	: 1;
    	transform 	: translate(0, 0px);}
}


/* ----------------------------------------------
	Topに戻るボタン
------------------------------------------------*/
#PageTopBtn {
	position	: fixed;
	bottom		: 109px;
	right		: 5%;
	z-index		: 2;}

#PageTopBtn a{
	display		: block;
	outline		: none;}

#PageTopBtn img:hover{
	opacity		: .5 ;}

.pt {	width	: 60px;
	height		: 60px;
	background	: url(../img/item/pagetop.png) no-repeat center / 100%;
	display		: block;}

/* smart phone setting
-----------------------*/
@media screen and (max-width: 960px) {
	.pt {background: url(../img/item/pagetop1.png) no-repeat center / 100%;}
}


/* ----------------------------------------------
	続きを読むボタン
------------------------------------------------*/
.accordion-box {
    position		: relative;}

.accordion-box label {
    height		: 140px; 	/* グラデーションの高さ */
    z-index		: 97;
    cursor		: pointer;
    text-align		: center;
    font-size		: 12px;
    position		: absolute;
    bottom		: 0;
    width		: 100%;
    background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.95) 90%);
    background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.95) 90%);
    background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.95) 90%);
    background: -ms-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.95) 90%);
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.95) 90%);}

.accordion-box input:checked + label {
    background		: inherit;} 	/* 開いた時には背景グラデーションを消す */

.accordion-box label:after {
    content		: "Read More"; 	/* ラベルの文字 */
    z-index		: 98;
    letter-spacing	: .05em;
    line-height		: 2.5rem;
    position		: absolute;
    bottom		: 20px;
    left		: 50%;
    -webkit-transform	: translate(-50%, 0);
    transform		: translate(-50%, 0);
    color		: #fff;
    background-color	: #000;
    width		: 18.75rem;
   -webkit-border-radius: 20px;
    -moz-border-radius	: 20px;
    border-radius	: 20px;}

.accordion-box input {
    display		: none;}

.accordion-box .accordion-container {
    overflow		: hidden;
    height		: 200px; 	/* 開く前に見えている部分の高さ */
    -webkit-transition	: all 0.1s;
    -moz-transition	: all 0.1s;
    -ms-transition	: all 0.1s;
    -o-transition	: all 0.1s;
    transition		: all 0.1s;}

.accordion-box input:checked + label:after {
    content		: "Close";}

.accordion-box input:checked ~ .accordion-container {
    height		: auto;
    padding-bottom	: 80px; 	/* 閉じるボタンのbottomからの位置 */
    -webkit-transition	: all 0.1s;
    -moz-transition	: all 0.1s;
    -ms-transition	: all 0.1s;
    -o-transition	: all 0.1s;
    transition		: all 0.1s;}
