
/*---------------------------------------------------------------------------
  TITLE
---------------------------------------------------------------------------*/

.sb_tit {
	padding:40px 0;
	background:#0058A6 url("../image/h2_bg.png") no-repeat top center;
}
.sb_tit:after { /*float�̉���*/
	display:block;
	clear:both;
	height:0px;
	visibility:hidden;
	content:".";
}
h2 {
	margin:0 auto;
	width:1000px;
	color:#FFF;
	font-size:190%;
	font-weight:normal;
	text-indent:20px;
}
h2:after { /*float�̉���*/
	display:block;
	clear:both;
	height:0px;
	visibility:hidden;
	content:".";
}

/* PAN */
.pan {
	display:block;
	float:right;
	text-align:right;
	font-size:12px;
	font-weight:normal;
}
.pan a {color: #fff; text-decoration:none;}
.pan a:hover {color: #fff; text-decoration:underline;}


/*====================================================================================================

  SUBPAGE

====================================================================================================*/

#subpage { padding:0;}

ul#anchor,
ul#anchor2 {
	clear:both;
	margin: 0 2% 40px;
	padding:10px 15px 0;
	border:1px solid #DDD;
	background:#FCFCFC;
}
ul#anchor2 { margin-bottom:0; border:none; background:none;}
ul#anchor:after,
ul#anchor2:after { /*float�̉���*/
	display:block;
	clear:both;
	height:0px;
	visibility:hidden;
	content:".";
}
ul#anchor li,
ul#anchor2 li {
	float:left;
	padding: 0 20px 10px 0px;
	text-indent:15px;
	line-height:100%;
	background:url("../image/link-anchor.gif") no-repeat left 3px;
}
ul#anchor2 li { float:none; padding-bottom:15px; line-height:130%;}
ul#anchor li a ,
ul#anchor2 li a{ color:#0058A6;}


/*---------------------------------------------------------------------------
  KAIGYOU
---------------------------------------------------------------------------*/

#subpage p.indention {
	clear:both;
	margin: 0 2%;
	height:40px;
	text-indent: -9999px;
	background:none;
}


/*---------------------------------------------------------------------------
  MIDASHI
---------------------------------------------------------------------------*/

#subpage h3 {
	clear:both;
	margin:0 2% 20px;
	padding:15px 20px;
	font-size: 130%;
	color:#569235;
	background:#FCFCFC;
	border:1px solid #CCC;
	border-left:4px solid #569235;
	position:relative;
}


#subpage h3.mid {
	 color:#FFF;
	 background:#0058A6;
	 border:none;
}
#subpage h4 {
	clear:both;
	margin:30px 2% 10px;
	padding:0 0 10px;
	font-size: 120%;
	color:#0058A6;
	border-bottom:1px solid #0058A6;
}
#subpage h5 {
	clear:both;
	margin:30px 2% 10px;
	font-size: 110%;
}


/*---------------------------------------------------------------------------
  CATCH COPY
---------------------------------------------------------------------------*/

#subpage .catch {
	clear:both;
	margin:20px 2%;
	font-weight:bold;
	font-size: 180%;
	line-height:120%;
}


/*---------------------------------------------------------------------------
  COMMENT
---------------------------------------------------------------------------*/

#subpage .comment1 {
	clear:both;
	margin:0 2% 20px;
}
#subpage .comment2 {
	clear:both;
	margin:0 2% 20px;
	padding: 2%;
	border: 1px solid #DDD;
	background:#F4F4F4;
}
#subpage .comment3 {
	clear:both;
	margin:0 2% 20px;
	padding: 2%;
	color: #FF4646;
	border: 1px solid #FF7575;
	background:#FFEAEA;
}


/*---------------------------------------------------------------------------
  HYOU
---------------------------------------------------------------------------*/

#subpage table.hyou {
	clear:both;
	margin:10px 2%;
	width:96%;
	background:#FFF;
	border-top:1px solid #DDD;
	border-left:1px solid #DDD;
}
#subpage table.hyou th, #subpage table.hyou td {
	border-right:1px solid #DDD;
	border-bottom:1px solid #DDD;
}
#subpage table.hyou th { background:#EEE;}
#subpage .comment1 table.hyou { margin:10px 0; width:100%;}
#subpage .comment2 table.hyou { margin:10px 0; width:100%;}
#subpage .comment3 table.hyou { margin:10px 0; width:100%;}




#subpage table.hyou2 {
	clear:both;
	margin:10px 2%;
	width:96%;
	font-size:85%;
	background:#FFF;
	border-top:1px solid #DDD;
	border-left:1px solid #DDD;
}
#subpage table.hyou2 th, #subpage table.hyou2 td {
	border-right:1px solid #DDD;
	border-bottom:1px solid #DDD;
}
#subpage table.hyou2 th { background:#EEE;}
#subpage .comment1 table.hyou2 { margin:10px 0; width:100%;}
#subpage .comment2 table.hyou2 { margin:10px 0; width:100%;}
#subpage .comment3 table.hyou2 { margin:10px 0; width:100%;}


/*---------------------------------------------------------------------------
  LIST
---------------------------------------------------------------------------*/

#subpage ul.list-ul {
	clear:both;
	margin:0 2%;
	padding:  0 0 10px;
}
#subpage ul.list-ul li {
	padding: 0 0 10px 20px;
	background: url("../image/list-arrow.gif") no-repeat left 5px;
}
#subpage ul.list-ul2 {
	clear:both;
	margin:0 2%;
	padding: 20px 0;
}
#subpage ul.list-ul2 li {
	padding: 0 0 10px 0;
}

#subpage ol {}
#subpage ol li { padding:10px 0;}
#subpage ol li p.link { margin-top:5px; padding-bottom:0;}





/*---------------------------------------------------------------------------
  LINK
---------------------------------------------------------------------------*/

#subpage .link {
	clear:both;
	margin:0 2%;
	padding: 0 0 10px 25px;
	background:url("../image/link-arrow.gif") no-repeat left 3px;
	box-sizing:border-box;
}
#subpage .comment1 .link { margin:0; padding-bottom:5px;}
#subpage .link_g {
	position:relative;
	clear:both;
	margin:0 2%;
	padding: 0 0 10px 25px;
	background:url("../image/link-arrow.gif") no-repeat left 3px;
	text-indent:35px;
	box-sizing:border-box;
}
#subpage .link_g:before {
	position:absolute;
	top:1px;
	display:block;
	content:"";
	width:30px;
	height:17px;
	background:url("../../image/gakunai.gif") no-repeat;
}


/* ej link */

#subpage .link_e1-1,
#subpage .link_e1-2,
#subpage .link_e2,
#subpage .link_e3-1,
#subpage .link_e3-2,
#subpage .link_e3-3,
#subpage .link_e4 {
	position:relative;
	clear:both;
	margin:0 2%;
	padding: 0 0 10px 25px;
	background:url("../image/link-arrow.gif") no-repeat left 3px;
	text-indent:65px;
	box-sizing:border-box;
}
#subpage .link_e1-1:before {
	position:absolute;
	top:1px;
	display:block;
	content:"";
	width:60px;
	height:17px;
	background:url("../../image/ej/icon1-1.png") no-repeat;
}
#subpage .link_e1-2:before {
	position:absolute;
	top:1px;
	display:block;
	content:"";
	width:60px;
	height:17px;
	background:url("../../image/ej/icon1-2.png") no-repeat;
}
#subpage .link_e2:before {
	position:absolute;
	top:1px;
	display:block;
	content:"";
	width:60px;
	height:17px;
	background:url("../../image/ej/icon2.png") no-repeat;
}
#subpage .link_e3-1:before {
	position:absolute;
	top:1px;
	display:block;
	content:"";
	width:60px;
	height:17px;
	background:url("../../image/ej/icon3-1.png") no-repeat;
}
#subpage .link_e3-2:before {
	position:absolute;
	top:1px;
	display:block;
	content:"";
	width:60px;
	height:17px;
	background:url("../../image/ej/icon3-2.png") no-repeat;
}
#subpage .link_e3-3:before {
	position:absolute;
	top:1px;
	display:block;
	content:"";
	width:60px;
	height:17px;
	background:url("../../image/ej/icon3-3.png") no-repeat;
}
#subpage .link_e4:before {
	position:absolute;
	top:1px;
	display:block;
	content:"";
	width:60px;
	height:17px;
	background:url("../../image/ej/icon4.png") no-repeat;
}





#subpage .file {
	clear:both;
	margin:0 2%;
	padding: 0 0 10px;
}
#subpage .file img { padding-right:10px;}

/* LINK PLURAL�@*************************/

#subpage .link-box {
	clear:both;
	padding: 20px 0;
}
#subpage .link-box:after { /*float�̉���*/
	display:block;
	clear:both;
	height:0px;
	visibility:hidden;
	content:".";
}
#subpage .link-box p {
	float:left;
	margin:0 0 0 2%;
	padding: 0 0 10px 2.5%;
	background:url("../image/link-arrow.gif") no-repeat left 2px;
}

/* LINK BOX2 */ #subpage .link2 p {width:45%;}
/* LINK BOX3 */ #subpage .link3 p {width:28.3%;}
/* LINK BOX4 */ #subpage .link4 p {width:20%;}
/* ie7hack */
*+html #subpage .link2 p {width:44%;}
*+html #subpage .link3 p {width:27.3%;}
*+html #subpage .link4 p {width:19%;}


/* LIST PLURAL�@*************************/

#subpage .list-box {
	clear:both;
	padding: 0 0 20px;
}
#subpage .list-box:after { /*float�̉���*/
	display:block;
	clear:both;
	height:0px;
	visibility:hidden;
	content:".";
}
#subpage .list-box p {
	float:left;
	margin:0 0 0 2%;
	padding: 0 0 10px 2.5%;
	background:url("../image/list-arrow.gif") no-repeat left 4px;
}

/* LINK BOX2 */ #subpage .list2 p {width:45%;}
/* LINK BOX3 */ #subpage .list3 p {width:28.3%;}
/* LINK BOX4 */ #subpage .list4 p {width:20%;}
/* ie7hack */
*+html #subpage .list2 p {width:44%;}
*+html #subpage .list3 p {width:27.3%;}
*+html #subpage .list4 p {width:19%;}


/* FILE PLURAL�@*************************/

#subpage .file-box {
	clear:both;
	padding: 20px 0;
}
#subpage .file-box:after { /*float�̉���*/
	display:block;
	clear:both;
	height:0px;
	visibility:hidden;
	content:".";
}
#subpage .file-box p {
	float:left;
	margin:0 2%;
	padding: 0 0 10px;
}
#subpage .file-box p img {padding-right:10px;}
/* FILE BOX2 */ #subpage .file2 p {width:46%;}
/* FILE BOX3 */ #subpage .file3 p {width:29.3%;}
/* FILE BOX4 */ #subpage .file4 p {width:21%;}
/* ie7hack */
*+html #subpage .file2 p {width:45%;}
*+html #subpage .file3 p {width:28.3%;}
*+html #subpage .file4 p {width:20%;}


/*---------------------------------------------------------------------------
  EMBEDDED
---------------------------------------------------------------------------*/

#subpage .embedded {
	clear:both;
	margin: 0 2%;
	padding:0 0 20px;
}


/*---------------------------------------------------------------------------
  PHOTO
---------------------------------------------------------------------------*/

#subpage .photo-l, #subpage .photo-l2 {
	float:left;
	padding:0 20px 0 0;
	background:#FFF;
}
#subpage .photo-r, #subpage .photo-r2 {
	float:right;
	padding:0 0 0 20px;
	background:#FFF;
}
#subpage .photo-c {
	clear:both;
	padding:0 0 10px;
	text-align:center;
}
#subpage .photo-l p, #subpage .photo-r p, #subpage .photo-c p {
	padding: 0 0 5px;
} 
#subpage .photo-l2 p {
	float:left;
	padding: 0 10px 0 0;
}
#subpage .photo-r2 p {
	float:right;
	padding: 0 0 0 10px;
}
#subpage .caption {
	font-size:80%;
	text-align:center;
}
#subpage .zu { margin: 0 2%; padding:10px 0 30px;}

/* PHOTO BOX�@*************************/

#subpage .photo-box {
	clear:both;
	padding:20px 0;
}
#subpage .photo-box:after { /*float�̉���*/
	display:block;
	clear:both;
	height:0px;
	visibility:hidden;
	content:".";
}
#subpage .photo-box ul { float:left; margin:0 2%; }
#subpage .photo-box ul li { margin: 0 0 5px;}
#subpage .g1 ul li {text-align:center;}

/* PHOTO BOX1 */ #subpage .g1 ul {width:96%; float:none;}
/* PHOTO BOX2 */ #subpage .g2 ul {width:46%;}
/* PHOTO BOX3 */ #subpage .g3 ul {width:29.3%;}
/* PHOTO BOX4 */ #subpage .g4 ul {width:21%;}
/* PHOTO BOX5 */ #subpage .g5 ul {width:16%;}
/* ie7hack */
*+html #subpage .g2 ul {width:45%;}
*+html #subpage .g3 ul {width:28%;}
*+html #subpage .g4 ul {width:20%;}
*+html #subpage .g5 ul {width:15%;}


/*---------------------------------------------------------------------------
  BOX
---------------------------------------------------------------------------*/

#subpage .box1 h4, #subpage .box2 h4 {
	clear:none;
	border:none;
	margin:5px 0 5px;
	padding:0;
	color:#569235;
	font-size:120%;
	background:none;
}
#subpage .box1 .catch, #subpage .box1 .catch2 {
	margin:0 0 20px;
}

/* BOX1 */
#subpage .box1 {
	clear:both;
	margin:20px 2% 0;
	width:96%;
}
#subpage .box1:after { /*float�̉���*/
	display:block;
	clear:both;
	height:20px;
	visibility:hidden;
	content:".";
}
#subpage .box1 h4 {}
#subpage .box1 p { padding-bottom:10px;/*overflow:hidden; �܂�Ԃ���*/}

/* BOX2 */
#subpage .box2 {
	float:left;
	margin:20px 2%;
	width:46%;
}
#subpage .box2 h4 {}
#subpage .box2 p { padding-bottom:10px; /*overflow:hidden; �܂�Ԃ���*/}

/* BOX3 */
#subpage .box3 {
	float:left;
	margin:20px 2% 0;
	width:96%;
	background:#F9F9F9;
	border:1px solid #EEE;
	border-radius: 5px; /* CSS3 */
	-webkit-border-radius: 5px; /* Safari,Google Chrome */
	-moz-border-radius: 5px;/* Firefox */
	overflow:hidden;
}
#subpage .box3 h5 {
	padding:15px 15px 15px 30px;
	color:#FF7F00;
	font-size:100%;
	background:#F9F9F9 url("http://www.kochi-tech.ac.jp/library/common/image/sbtit_bg1.gif") no-repeat 15px center;
	border-bottom:1px dotted #CCC;
}
#subpage .box3 p {
	padding:15px;
	background:#FFF;
}


/*---------------------------------------------------------------------------
  LINE
---------------------------------------------------------------------------*/

#subpage .line {
	clear:both;
	margin:0 2%;
	padding:50px 0;
}
#subpage .line hr {
	height: 1px;
	border: none;
	border-top: 1px #AAA dotted;
}


/*---------------------------------------------------------------------------
  BUTTON
---------------------------------------------------------------------------*/

#subpage .button-box {
	clear:both;
	padding:10px 0;
}
#subpage .button-box:after { /*float�̉���*/
	display:block;
	clear:both;
	height:0px;
	visibility:hidden;
	content:".";
}
#subpage .button-box p {
	float:left;
	margin:0 2%;
	text-align:center;
	background:#666;
	border-radius: 5px; /* CSS3 */
	-webkit-border-radius: 5px; /* Safari,Google Chrome */
	-moz-border-radius: 5px;/* Firefox */
}
#subpage .button-box a {
	display:block;
	padding:7px;
	color:#FFF;
	font-weight:bold;
	text-decoration:none;
}
#subpage .button-box p a:hover {
	background:#999;
	border-radius: 5px; /* CSS3 */
	-webkit-border-radius: 5px; /* Safari,Google Chrome */
	-moz-border-radius: 5px;/* Firefox */
}
/* BUTTON BOX1 */ #subpage .b1 p { width:60%; float:none; margin:0 auto;}
/* BUTTON BOX2 */ #subpage .b2 p { width:46%; background:#0058A6; color:#333;}
/* BUTTON BOX3 */ #subpage .b3 p { width:29.3%; background:#0058A6; color:#333;}


/* other button */
#subpage .b1_a {
	clear:both;
	margin:0 2%;
	font-size:13px;
}
#subpage .b1_a a {
	display:block;
	padding:5px;
	text-align:center;
	text-decoration:none;
	font-weight:bold;
	border-radius: 5px; /* CSS3 */
	-webkit-border-radius: 5px; /* Safari,Google Chrome */
	-moz-border-radius: 5px;/* Firefox */
}





/* ====================================================================================================

	スマホ化用css

==================================================================================================== */

@media only screen and (max-width:700px){

    .sb_tit { padding:20px 10px;}
    h2 { width:100%; padding:0; letter-spacing:0.1em; font-size:20px; text-indent:0px;}
	.pan { float:none; margin-top:3em; margin-right:1em; font-size:10px; line-height:1;}
    
    #subpage { 
        margin:0 auto !important;
        width:100%;
        box-sizing:border-box;
    }
    
    
    /* MIDASHI */
    #subpage h3 { margin:0 2% 20px; font-size: 120%;}
    #subpage h4.mid { margin:0 2% 20px; font-size: 110%;}
    #subpage h4 { margin:0 2% 20px; font-size: 100%;}
    
    /* CATCH COPY */
    #subpage .catch { margin:0 2% 20px; font-size: 120%;}
    
    /* COMMON */
	#subpage :is(.comment1, .comment2, .comment3) { margin:0 2% 20px; word-break:break-all;}
	#subpage :is(.comment1, .comment2, .comment3) img { max-width:100%;}
	#subpage :is(.comment2, .comment3) { padding:5%;}
    
    /* HYOU */
	#subpage .scroll_wrap { width:100%; overflow-x:auto;}
	#subpage .scroll_wrap > :is(table.hyou, table.hyou2) { width:700px; font-size:0.8rem;}

    
    
    /* LIST */
    #subpage ul.list-ul { margin:20px 2%;}
    
    /* LINK */
    #subpage .link2,
    #subpage .link3,
    #subpage .link4 {width:auto;}
    #subpage .file2,
    #subpage .file3,
    #subpage .file4 {width:auto;}
    
    /* EMBEDDED */
    #subpage .embedded { margin:0 2% 20px;}
    #subpage .embedded img { width:100%;}
    #subpage .embedded iframe { width: 100%; height: 300px;}
    
    /* PHOTO BOX */
    #subpage ul.photo_box { clear:none !important; float:none !important; margin:2%; width:96% !important; text-align:center;}
    #subpage ul.g1 li,
    #subpage ul.g2 li,
    #subpage ul.g3 li,
    #subpage ul.g4 li,
    #subpage ul.g5 li{ margin:15px 0; width:100%; text-align:center;}
    #subpage ul.g1 li.photo img,
    #subpage ul.g2 li.photo img,
    #subpage ul.g3 li.photo img,
    #subpage ul.g4 li.photo img,
    #subpage ul.g5 li.photo img { max-width:240px !important; height:auto !important;}
    
    /* YOUTUBE */
    #subpage .youtube {position: relative; width: 100%;}
    #subpage .youtube iframe { width: 100% !important;  height: 100% !important;}
    
    /* BOX */
    #subpage .temple-box { margin:0 2%; width:96%;}
    #subpage .temple-box:after { display:none;}
    #subpage .box1,
    #subpage .box2 { float:none;margin: 0 2% 20px; width:96%;}
    #subpage .box1:after,
    #subpage .box2:after { display:none;}
    #subpage .box1 .catch { margin:0 0 20px !important;}
    #subpage .box1 h4,
    #subpage .box2 h4 { margin:10px 0; font-size:100%;}
    #subpage .photo-c { float:none; padding:0; width:100%;}
    #subpage .photo-c img { max-width:240px !important; height:auto !important; padding:0 0 20px;}
    #subpage .photo-l,
    #subpage .photo-r { float:none; padding:0; width:100%; text-align:center;}
    #subpage .photo-l img,
    #subpage .photo-r img { max-width:240px !important; height:auto !important; padding:0 0 20px;}
    
    /* LINE */
    #subpage .line {
        margin:0 2% 20px;
        height:50px;
        background-size:100% auto;
    }
    
    /* BUTTON */
    #subpage .btn { float:none; margin:1% 2%;}
    #subpage .b1,
    #subpage .b2,
    #subpage .b3 { width:auto;}
    
    /* COLUMNBOX */
    #subpage .column {}
    #subpage .column:after { display:none;}
    #subpage .column .col2 { float:none; margin: 2%; width: 96%;}
    #subpage .column .col3 { float:none; margin: 2%; width: 96%;}
    #subpage .column .col4 { float:none; margin: 2%; width: 96%;}
    #subpage .column .col5 { float:none; margin: 2%; width: 96%;}
    
    /* FLOW */
    #subpage ul.flow_box {}
    #subpage ul.flow_box:after { display:none;}
    #subpage ul.flow_box li { float:none; width:96% !important;}
    #subpage ul.flow_box li a:hover {}
    #subpage .flow1+.flow1 { margin-top:30px;}
    #subpage .flow1+.flow1:before { top:-30px;}
    #subpage ul.flow_box li+li { margin-top:30px;}
    #subpage ul.flow_box li+li:before {
        position:absolute;
        top:-30px;
        left:0;
        display:block;
        clear:both;
        content:"";
        width:100%;
        height:30px;
        background:url(../image/flow_bg_sm.png) no-repeat center center;
    }
    #subpage .flow1a+.flow1a {margin-top:30px;}
    #subpage .flow1a+.flow1a:before { top:-30px; width:100%;}
    #subpage .flow1a li+li { margin-top:5px !important; padding: 0 !important;}
    
    
    /*====================================================================================================
      NEWS
    ====================================================================================================*/
    #news { width: 90%; margin: auto; }
    #news .news_list ul { padding:10px 0 12px; }
    #news .news_list ul li {
        float:none;
        width:100%!important;
        padding:0 20px;
        line-height:150%;
    }
    #news .news_list ul li:nth-child(1) { text-align:left; }
    
    
    /*====================================================================================================
      HISTORY
    ====================================================================================================*/
    .history dl {}
    .history dt,
    .history dd { float:none; width:100%;}
    .history dl:nth-child(odd) { background: rgba(232,91,148,0.05);}
    
    
    /*====================================================================================================
      OFFICE
    ====================================================================================================*/
    
    
    /*====================================================================================================
      RECRUIT HEADER
    ====================================================================================================*/
    .recruit_head { padding:0; width: 100%; background-size:200% auto;}
    .recruit_head .greeting{
        margin: 0; padding: 10% 10% 250px; 
    }
    .recruit_head .greeting:before{
        margin: auto; 
        position: absolute; bottom:0; left:0; right:0;
        width: 300px; height:200px;
        background-size:100% auto;
    }
    .recruit_head .greeting .text{ width:100%;}
    .recruit_head .greeting h2.re-title{
        margin: 0; width:100%; height:125px;
        background-size:100% auto;
    }
    .recruit_head .navi {
        background: #FFF;
        border-bottom:#E85B94 5px solid;	
    }
    .recruit_head .navi ul { border-top:1px solid #eee;}
    .recruit_head .navi ul li { float: none; width:100%; }
    .recruit_head .navi ul li+li { border-top:1px solid #eee;}
    .recruit_head .navi ul li a { padding:5% 0 !important;	height:auto;}
    .recruit_head .navi ul li a br { display: none;}
    .recruit_head .navi ul li a:hover{
        color: #FFF;
        background: #FF6187 url(../../image/recruit/nav-bk.png) no-repeat left center
    }
    
    
    /*====================================================================================================
      RECRUIT CONTENT
    ====================================================================================================*/
    
    #recruit { font-size: 100%;}
    #recruit #subpage { max-width:none;}
    #recruit h3 { background-size:150% auto;}
    
    /*****  TABLE *****/
    #recruit .recruit_table ul.ac li,
    #recruit .recruit_table ul.en li{float:none; width:100% !important;}
    
    /*****  FAMINY *****/
    #recruit #family {padding-bottom: 200px; background-size:150% auto;}
    #recruit #family .text{ padding:10%;}
    #recruit #family .text .title {width:100%;}
    #recruit #family .text .exp{ width:100%;}


	/*====================================================================================================
    	例外処理
    ====================================================================================================*/

	/* application.html */
	#subpage:has(a[name="gakugai_request"]) .comment2 {
		display:flex;
		flex-direction:column;
		gap:1rem;

		& > * { width:100%!important; float:none!important;}
		& br[clear] { display:none;}
	}
}