@charset "utf-8";

/*
Site URL	http://www.umin.ac.jp/hp-coordinator/＊
Created		2015/03/10
Last update	2015/03/17 by Hayashi
Author		Hayashi Ryosuke
*/


/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝
	基礎情報
	hp-coordinator #009900
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
#sphp_image_color{
	border-top:5px solid #009900;
	background:#FFF;
}
#sphp_image_color h2:before{
	background-color:#009900;
}
#sphp_image_color h2.oshirase_box:before{
	background-color:transparent;
}
#sphp_image_color h3:before{
	background:#009900;
}
#sphp_image_color h3:after{
	background:#222266;
}

#webmailfaq_image_color{
	border-top:5px solid #009900;
	background:#FFF;
}
#webmailfaq_image_color h2:before{
	background-color:#009900;
}
#webmailfaq_image_color h2.oshirase_box:before{
	background-color:transparent;
}
#webmailfaq_image_color h3:before{
	background:#009900;
}
#webmailfaq_image_color h3:after{
	background:#222266;
}

.text_red{
	color:#F00;
}
.text_gree{
	color:#090;
}
.text_bold{
	font-weight:bold;
}
.clear_both{
	clear:both;
}
.yline{
	font-weight: bold;
	background: linear-gradient(transparent 40%, #ff9 40%); 
}
p{
	padding: 0 18px;
}
.a_link a[href^="http://"]:before,
.a_link a[href^="https://"]:before{
	content:url(/images/email/link.png);
	padding-right:0px;
}
.a_link a[href^="#"]:before{
	content:"";
}
#backtop{
	position: fixed;
	right: 5px;
	bottom: 40px;
	z-index:10;
	padding:3px;
	cursor:pointer;
	text-align:center;
	color:#FFF;
	background-color:rgba(10,10,10,0.6);
}
#backtop div{
	cursor:pointer;
	border:dotted #DDD 2px;
	padding:4px;
}
@media only screen and (max-width:600px){
#backtop{
	width:100%;
	right: 0px;
	bottom: 0px;
}
}

/*
	hp-coordinator INDEX.HTML
*/
.hpcood-sec{
	clear: both;
	display: -webkit-flex;
	display: flex;
	margin-bottom: 80px;
}
.hpcood-sec section{
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	margin: 10px;
	border-radius: 5px;
	background: #F5F0CF;
	padding: 12px;
}
.hpcood-sec section h4{
	margin: 0 14px 14px 14px ;
	padding: 0;
	color: #FFF;
}
.hpcood-sec img{
	margin: 0 4px;
}
@media screen and (max-width: 700px) {
  .hpcood-sec {
    flex-direction: column;
  }
}
.hpcood-sec section.col-square{
	background-color:#039 ;
}
.hpcood-sec section.col-plaza{
	background-color:#639 ;
}

.winscp,
.filezilla,
.webftp{
	background-color: #fff;
	border-radius: 5px;
	padding: 4px;
	margin-bottom: 4px;
}
.open_box{
	text-decoration: underline;
	color: #44f;
	cursor: pointer;
}
.open_box:before{
	content:url(/images/email/ar_g.png);
	padding-right:0px;
}
.hiding_box{
	display: none;
}
.hiding_box dl{
	margin: 4px 0 4px 12px;
}
.hiding_box dt{
	font-weight: bold;
}
.hiding_box dd{
	margin-left: 12px;
}

/*
	hp-coordinator howtoopen.htm
	アップロード先にについて
*/
.webftp-s dl{
	padding: 0;
	margin: 0;
}
.webftp-s dl dt{
	font-weight: bold;
}
.webftp-s dl dd{
	padding-left: 12px;
}
.hpdir{
	border: 2px #090 solid;
	padding: 4px;
	margin: 4px;
	width: auto;
	position: relative;
	height: 120px;
}
span.webftp-p{
	padding: 4px;
	line-height: 1.3em;
}
span.home{
	position: absolute;
	top: 5px;
	left: 5px;
	font-weight: bold;
}
span.account{
	position: absolute;
	top: 20px;
	left: 8px;
	z-index: 10;
	background-color: #FFCC66;
	padding: 4px 10px 4px 0;
	font-weight: bold;
}
span.hpopen{
	position: absolute;
	top: 27px;
	left: 27px;
	width: 200px;
	height: 80px;
	z-index: 9;
	border: 3px solid #FF9900;
	background-color: #ff9;
	padding: 14px 10px 10px 10px;
	font-weight: bold;
}

/*
	hp-coordinator plaza_pl.htm
	プログラム環境設定について
*/
#plaza-perl ol{
	margin-left: 60px;
	list-style-position: outside;
}
#plaza-perl dl{
	margin-left:40px;
}
#plaza-perl dl dt{
	font-weight: bold;
}
#plaza-perl dl dd{
	margin-left: 20px;
	padding-bottom: 12px;
}
.cgi-bg{
	background-color: #EFE;
}

/*
	hp-coordinator plaza_htaccess.htm
	hp-coordinator square_htaccess.htm
*/
#square-htaccess h4.exh,
#plaza-htaccess h4.exh{
	padding-top:32px;
}
#square-htaccess dl,
#plaza-htaccess dl{
	margin: 12px 40px;
}
#square-htaccess dl dt,
#plaza-htaccess dl dt{
	font-weight: bold;
	padding-top: 7px;
}
#square-htaccess dl dd,
#plaza-htaccess dl dd{
	margin: 7px 0px 7px 20px;
}
#square-htaccess ul,
#plaza-htaccess ul{
	margin: 12px 40px;
	list-style-position: outside;
}
.open-area{
	background: linear-gradient(transparent 82%, #FFB152 12%); 
}
.accsee-area{
	background: linear-gradient(transparent 82%, #00C659 12%); 
}
.htaccess{
	margin: 12px 40px;
	border: #090 2px solid;
	border-radius: 5px;
}
.htpasswrd{
	margin: 12px 40px;
	border: #090 2px solid;
	border-radius: 5px;
}
.redirect{
	margin: 12px 40px;
	border: #090 2px solid;
	border-radius: 5px;
}
.htaccess p,
.htpasswrd p,
.redirect p{
	margin: 12px 24px;
}

#hp_count table{
	margin-left: 40px;
}

/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
	FOOTER
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
#h_footer{
	/*background-color:#FFF;*/
	background:url(/images/footer_bg.png) #EEE;
	border-top:#CCC solid 2px;
}
#h_footer h4{
	padding:0;
	margin:5px;
}
#h_footer p{
	padding:0;
	margin:0;
}
#h_footer ul{
	margin:0 0 10px 0px;	
	padding:7px 0 0 0;
	border-left:#CCC dotted 2px;
	list-style:none;
}
#h_footer li{
	width:95%;
	padding-left:7px;
	margin-bottom:4px;s
	font-size:12px;
}

@media only screen and (max-width:600px){
#h_footer ul{
	width:100%;
}
}


.faq-body{
	border-top: 4px double rgb(50, 50, 50);
}
.faq-q{
	padding: 1.5rem 0;
	border-bottom: dotted 1px rgb(100, 100, 100);
	font-weight: 600;
	font-size: 1.6rem ;
	line-height: 1.2em;
}
.faq-q-body{
	position: relative;
	margin-left: 4rem;
}
.faq-q-body::before{
	position: absolute;
	content: url(/images/Q.png);
	left: -4rem;
	top :-1rem;
}
.faq-a{
	padding: 1.5rem 0;
	margin-bottom: 1rem;
	line-height: 1.2em;
}
.faq-a-body{
	position: relative;
	margin-left: 4rem;
}
.faq-a-body::before{
	position: absolute;
	content: url(/images/A.png);
	left: -4rem;
	top :-.5rem;
}



/*sso/hp/*/
.sso-zip{
	margin: 1rem 2rem;
	display: inline-block;
}
.sso-zip > a{
	border: 4px solid rgb(200, 255,182);
	border-radius: 5px;
	padding: 1rem 2rem ;
	text-decoration: none;
	box-shadow: 2px 2px 3px rgb(50, 100, 50);
}


.menu-flex{
	display: flex;
	justify-content: flex-start;
	list-style: none;
	margin: 0.5rem;
	padding: 0;
}
.menu-flex li{
	border:solid 1px rgb(200,200,200);
	background-color: rgb(255,255,255);
	padding:0.2rem 1rem;
	font-size: 1.2rem;
	width: 50%;
	background-color: rgb(240,255,240);
}
.menu-flex li a{
	text-decoration: none;
	width: 95%;
	display: inline-block;
}


/*共通ｈP案内ページ*/
.oshirase{
	position: relative;
}
.oshirase-body{
	border: 2px double rgb(100,100,100);
	padding: 1em;
}
.oshirase-title{
	position: absolute;
	font-weight: 600;
	background-color: rgb(50, 180, 50);
	color: rgb(255, 255, 255);
	padding: .5em 1em;
	top:0.5em;
	left: 0em;
}
.oshirase-ul{
	list-style: none outside;
}

.hp-button{
	width: 95%;
	border: 4px solid rgb(180, 255, 180);
	border-radius: 0.5rem ;
	box-shadow: 2px 2px 0 rgb(50, 150, 50);
	text-align: center;
	margin: 1rem 0 1rem 2rem ;
}
.hp-button > a{
	display: inline-block;
	width: 100%;
	height: 100%;
	padding: 2rem 4rem ;
	text-decoration: none;
	font-size: 2rem ;
	background-color: rgb(250, 255, 250);
}
.hp-button-add-icon{
	position: relative;
	background: url(/images/hp/new-add-50.png) no-repeat;
	background-position: 10px 10px;
}
.hp-button-set-icon{
	position: relative;
	background: url(/images/hp/setting-a.png) no-repeat;
	background-position: -80px 0px;
}
.content-body{
	padding-top: 2rem;
}
.content-body li{
  margin-bottom: .3em;
}

	.comparison{
	}
	.comparison table{
		margin:1rem 2rem ;
		border-collapse:collapse;
		border-spacing:0;
	}
	.comparison table tr{
		border:1px solid rgb(50, 50, 50);	
	}
		.coltitle{
			background:rgb(255, 255, 255);
		}
		.colsquare{
			background:rgb(240,240,255);
		}
		.colplaza{
			background:rgb(255,240,250);
		}
	.comparison table tr:nth-child(even){
		background-color:inherit;
	}
	.comparison table tr:nth-child(odd){
		background-color:inherit;
	}
	.comparison table tr:hover{
		background:rgb(255,255,220);
	}
	.comparison table tr.tr_header:hover{
		background:inherit;
	}
	.comparison table tr th{
		padding:10px;
		white-space: nowrap;
		border:1px solid rgb(50, 50, 50);	
	}
	.comparison table tr td{
		padding: 1rem ;
		border:1px solid rgb(50, 50, 50);	
	}
	.comparison table tr td ul{
		margin:0 2rem 0 1rem;
		padding:0;
		list-style:inside;
	}
	.comparison table tr td ul li{
		margin:0;
		padding:0;
		white-space: nowrap;
	}
	.comparison ul{
		list-style:outside;
		margin-top:1rem;
	}


pre{
	margin:0 2rem ;
	border: 1px solid rgb(50, 50, 50);
	padding: 1rem;
}
strong {
  text-decoration: underline;
  text-decoration-thickness: 0.5em;
  text-decoration-color: rgba(255, 228, 0, 0.6);
  text-underline-offset: -0.2em;
  text-decoration-skip-ink: none;
}


.input-field input{
  all: initial;
  box-sizing: border-box;
  padding: 2px;
  border: 1px solid #ccc;
  font: inherit;
  display: inline-block;
  margin-bottom:0.5em;
}

.uminidlabel{
  display: inline-block;
  width:8em;
}

button {
  width: 11em;
  height:3em;
}

button.cord {
  width: 13em;
  height:3em;
  margin-bottom:0.5em;
  background-color: rgb(120,120,255);
  color: rgb(255,255,255);
}

button.copy {
  width: 13em;
  height:3em;
  margin-bottom:0.5em;
}

.plazabutton{
  width: 95%;
  border: 4px solid rgb(255, 150, 150);
  border-radius: 0.5rem ;
  box-shadow: 2px 2px 0 rgb(50, 150, 50);
  text-align: center;
  margin: 1rem 0 1rem 2rem ;
}

.plazabutton > a{
	display: inline-block;
	width: 100%;
	height: 100%;
	padding: 2rem 4rem ;
	text-decoration: none;
	font-size: 2rem ;
	background-color: rgb(255, 200, 200);
}
.plazabutton-add-icon{
	position: relative;
	background: url(/images/hp/new-add-50.png) no-repeat;
	background-position: 10px 10px;
}

/*バーチャルホスト申請ボタンデザイン*/
.vh-host-button{
	border: 2px solid rgba(255,190,190,1);
	border-radius: 5px;
	width: 50%;
	padding: .5em 1em;
	box-shadow: 2px 2px 0px rgba(180,120,120,1);
}

.plaza-oshirase-title{
	position: absolute;
	font-weight: 600;
	background-color: rgb(246, 134, 134);
	color: rgb(255, 255, 255);
	padding: .5em 1em;
	top:0.5em;
	left: 0em;
}