@charset "utf-8";
@media print{
	#photarea{
        display: none;
	}
	#illustarea{
        display: none;
	}
	#programarea{
        display: none;
	}
	#head_area{
        display: none;
	}
	#play_set{
        display: none;
    }
	#riyochui{
        display: none;
    }
	#prtbtn1{
        display: none;
    }
	#prtbtn2{
        display: none;
    }
}
body header {
    width: 100%;
    height: 135px;
    border-top: 4px solid #7089FF;
}
#hderArea {
    margin: auto;
    width: 100%;
    height: auto;
}
#hderArea h1 {
    float: left;
    height: auto;
}

body header nav {
    float: left;
    width: 500px;
    margin-left: 50px;
    margin-top: 30px;

}
#hderArea nav ul {
    width: 100%;
    padding: 0px;
    height: 20px;
    list-style-type: none;
    margin-top: 20px;
}
#hderArea nav ul li {
    width: 100px;
    height: 20px;
    float: left;
    text-align: center;
}
/*メニューバーの色*/
.navbar-nav.mx-auto .nav-item .nav-link {
	color: #3284ba;
}
.navbar-nav.mx-auto .nav-item .nav-link:hover {
	color: #0f5b8c;
}
.navbar-nav.mx-auto .nav-item.dropdown .LinkColor_yellow {
	color: #FFB300;
}
.navbar-nav.mx-auto .nav-item.dropdown .LinkColor_yellow:hover {
	color: #AA7700;
}
.navbar-nav.mx-auto .nav-item.dropdown .LinkColor_purple {
	color: #BE00D6;
}
.navbar-nav.mx-auto .nav-item.dropdown .LinkColor_purple:hover {
	color: #760085;
}

.riyokaisi{
  display       : inline-block;
  border-radius: 0.67em;   /* 角丸 */
  font-size     : 12pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 8px 20px;   /* 余白       */
  margin       : 0px 20px;   /* 余白       */
  background    : #ffee00;     /* 背景色     */
  color         : #000000;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  border        : 2px solid #000066;    /* 枠の指定 */
}
.row .col-sm-9 a {
  text-decoration: none;
}
.sendbtn{
  display       : inline-block;
  border-radius: 0.67em;   /* 角丸 */
  font-size     : 12pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 8px 30px;   /* 余白       */
  margin       : 0px 30px;   /* 余白       */
  background    : #95dedd;     /* 背景色     */
  color         : #000000;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  border        : 1px solid #9e9e9e;    /* 枠の指定 */
}

.m_area{
	overflow-y: auto;
	/*font-size: 10pt;*/
}

textarea {
  resize: none;
  width:175px;
  height:300px;
}

.textarea_kinsi {
	border: 2px solid #218a3f;  /* 枠線 */
    border-radius: 0.67em;   /* 角丸 */
    padding: 0.5em;          /* 内側の余白量 */
    background-color: #dbffe5;  /* 背景色 */
    width: 175px;            /* 横幅 */
    height: 160px;           /* 高さ */
    font-size: 1em;          /* 文字サイズ */
    line-height: 1.2;        /* 行の高さ */
}

.textarea_toroku{
	border: 2px solid #1c0f91;  /* 枠線 */
    border-radius: 0.67em;   /* 角丸 */
    padding: 0.5em;          /* 内側の余白量 */
    background-color: #cfc9ff;  /* 背景色 */
    width: 175px;            /* 横幅 */
    height: 160px;           /* 高さ */
    font-size: 1em;          /* 文字サイズ */
    line-height: 1.2;        /* 行の高さ */
}

.textarea_group {
	border: 2px solid #aca7db;  /* 枠線 */
    border-radius: 0.67em;   /* 角丸 */
    padding: 0.5em;          /* 内側の余白量 */
    background-color: #d7d5e8;  /* 背景色 */
    width: 175px;            /* 横幅 */
    height: 120px;           /* 高さ */
    font-size: 1em;          /* 文字サイズ */
    line-height: 1.2;        /* 行の高さ */
}
/* safariの場合 */
_::-webkit-full-page-media,_:future,:root .textarea_group{
	height: 30px;           /* 高さ */
}

.textarea_seitono {
	border: 2px solid #ffcb36;  /* 枠線 */
    border-radius: 0.67em;   /* 角丸 */
    padding: 0.5em;          /* 内側の余白量 */
    background-color: #fff7e0;  /* 背景色 */
    font-size: 1em;          /* 文字サイズ */
    line-height: 1.2;        /* 行の高さ */
}

.textarea_seitoname {
	border: 2px solid #38dfff;  /* 枠線 */
    border-radius: 0.67em;   /* 角丸 */
    padding: 0.5em;          /* 内側の余白量 */
    background-color: #e6fbff;  /* 背景色 */
    font-size: 1em;          /* 文字サイズ */
    line-height: 1.2;        /* 行の高さ */
}

.select_group {
	border: 1px solid #000000;  /* 枠線 */
    padding: 0.3em;          /* 内側の余白量 */
    background-color: #FFFFFF;  /* 背景色 */
    width: 150px;            /* 横幅 */
    font-size: 1em;          /* 文字サイズ */
    line-height: 1.2;        /* 行の高さ */
}

.logarea {
	background-color: #e6fbff;  /* 背景色 */
	width: 100%;
	height: 450px;
}

.upload_back {
	border: 4px solid #C6FFDB;  /* 枠線 */
    border-radius: 0.67em;   /* 角丸 */
    padding: 0.5em;          /* 内側の余白量 */
    background-color: #ffffff;  /* 背景色 */
    font-size: 1em;          /* 文字サイズ */
    line-height: 1.2;        /* 行の高さ */
}
.illust_back{
	border: 4px solid #C6FFDB;  /* 枠線 */
    border-radius: 0.67em;   /* 角丸 */	
    padding: 0em 2em;          /* 内側の余白量 */
    background-color: #ffffff;  /* 背景色 */
}
.psizew img{
	width: 25px;
}
.psizeh img{
	height: 25px;
}
.modal { /* covers the main window */
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 90;
    overflow: auto;
    background-color:rgb(0,0,0);
    background-color: rgba(0,0,0,0.4);
  }
  .modalWindow {
    position: fixed;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background-color: rgb(215, 220, 223);
    border-radius: 8px;
    padding: 10px 20px;
    box-shadow: 2px 2px 10px rgba(0,0,0,0.2);
  }
  .modalFooter {
    text-align: right;  /* cancel button at the right corner */
  }
  .modalWindow ul {
    list-style: none;  /* no bullet */
  }
  .modalWindow a {
    text-decoration: none;  /* no underline */
    cursor: pointer;  /* pointer even for anchors without href */
    color: #48f;
  }

.wrap{vertical-align: top;}

.ken1{position:static; z-index: 1;}
.ken2{position:relative; top:0px; left:-9px; z-index: 2;}
.ken3{position:relative; top:0px; left:-18px; z-index: 1;}
.ken4{position:relative; top:0px; left:-27px; z-index: 2;}
.ken5{position:relative; top:0px; left:-36px; z-index: 1;}
.ken6{position:relative; top:0px; left:-36px; z-index: 1;}
.ken7{position:relative; top:0px; left:-45px; z-index: 2;}
.ken8{position:relative; top:0px; left:-54px; z-index: 1;}
.ken9{position:relative; top:0px; left:-63px; z-index: 2;}
.ken10{position:relative; top:0px; left:-72px; z-index: 1;}
.ken11{position:relative; top:0px; left:-81px; z-index: 2;}
.ken12{position:relative; top:0px; left:-90px; z-index: 1;}

.ken13{position:relative; top:0px; left:-90px; z-index: 1;}
.ken14{position:relative; top:0px; left:-99px; z-index: 2;}
.ken15{position:relative; top:0px; left:-108px; z-index: 1;}
.ken16{position:relative; top:0px; left:-117px; z-index: 2;}
.ken17{position:relative; top:0px; left:-126px; z-index: 1;}
.ken18{position:relative; top:0px; left:-126px; z-index: 1;}
.ken19{position:relative; top:0px; left:-135px; z-index: 2;}
.ken20{position:relative; top:0px; left:-144px; z-index: 1;}
.ken21{position:relative; top:0px; left:-153px; z-index: 2;}
.ken22{position:relative; top:0px; left:-162px; z-index: 1;}
.ken23{position:relative; top:0px; left:-171px; z-index: 2;}
.ken24{position:relative; top:0px; left:-180px; z-index: 1;}

.ken25{position:relative; top:0px; left:-180px; z-index: 1;}
.ken26{position:relative; top:0px; left:-189px; z-index: 2;}
.ken27{position:relative; top:0px; left:-198px; z-index: 1;}
.ken28{position:relative; top:0px; left:-207px; z-index: 2;}
.ken29{position:relative; top:0px; left:-216px; z-index: 1;}
.ken30{position:relative; top:0px; left:-216px; z-index: 1;}
.ken31{position:relative; top:0px; left:-225px; z-index: 2;}
.ken32{position:relative; top:0px; left:-234px; z-index: 1;}
.ken33{position:relative; top:0px; left:-243px; z-index: 2;}
.ken34{position:relative; top:0px; left:-252px; z-index: 1;}
.ken35{position:relative; top:0px; left:-261px; z-index: 2;}
.ken36{position:relative; top:0px; left:-270px; z-index: 1;}
.ken37{position:relative; top:0px; left:-270px; z-index: 1;}

.ken185{position:relative; top:0px; left:-250px; z-index: 1;}

.ken101{position:static; top:0px; left:0px; z-index: 3;}

 /*印刷対象外クラスのスタイル*/
 .no_print{
 	display: none;
 }

.kenback-red{background-color: #ffccd3;}
.kenback-green{background-color: #c6ffbf;}
.kenback-blue{background-color: #c4c4ff;}
.kenback-yellow{background-color: #fff5b3;}
.kenback-purple{background-color: #f2d9ff;}
.kenback-lightblue{background-color: #cffbff;}
.kenback-white{background-color: #cfcfcf;}
.kenback-gray{background-color: #ffffff;}

 /*吹き出し*/
.mode_send{
	text-align: right;

}
.mode_recieve{
	text-align: left;
}
.fuki-left {
  position: relative;
  display: inline-block;
  margin: 0em 0 0.5em 15px;
  padding: 7px 10px;
  min-width: 120px;
  max-width: 100%;
  color: #555;
  font-size: 16px;
  background: #e0edff;
  border-radius: 15px;
}
.fuki-left p {
  margin: 0;
  padding: 0;
}
.fuki-right {
  position: relative;
  display: inline-block;
  margin: 0em 15px 0.5em 0;
  padding: 7px 10px;
  min-width: 120px;
  max-width: 100%;
  color: #555;
  background: #8ad19c;
  border-radius: 15px;
}
.fuki-right p {
  margin: 0;
  padding: 0;
}

 /*吹き出し表示の背景色*/
.backcolor-default{
	background-color: #fafaa2;
}

.tanto_title {
	color: #000000;/*文字色*/
  padding: 0.5em;/*文字周りの余白*/
  display: inline-block;/*おまじない*/
  line-height: 1.3;/*行高*/
  background: #ffa58c;/*背景色*/
  vertical-align: middle;
  border-radius: 25px 0px 0px 25px;/*左側の角を丸く*/
}
.tanto_title:before {
  content: '●';
  color: white;
  margin-right: 8px;
}

.btn-gradient-radius-client {
  display: inline-block;
  padding: 20px 80px;
  border-radius: 100px;
  text-decoration: none;
  color: #FFF;
  background-image: linear-gradient(45deg, #2cb5db 0%, #7ae2ff 100%);
  transition: .4s;
}
.btn-gradient-radius-server {
  display: inline-block;
  padding: 20px 80px;
  border-radius: 100px;
  text-decoration: none;
  color: #FFF;
  background-image: linear-gradient(45deg, #4bbf2e 0%, #7fe665 100%);
  transition: .4s;
}

.t_center{
	text-align: center;
    margin-left: auto;
    margin-right: auto;
}

.modetitle {
    color: #555555;
    font-weight: bold;
    font-size: 1.5em;
}

.color_red {
    color: #ff0000;
}
.fontbold {
    font-weight: bold;
}

.text-height-5{
    height: calc( 1.3em * 5 );
    line-height: 1.3;
	width: 80%;
}
.printbtn{
  display       : inline-block;
  border-radius : 5%;          /* 角丸       */
  font-size     : 12pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 8px 20px;   /* 余白       */
  margin       : 0px 20px;   /* 余白       */
  background    : #2D6D9B;     /* 背景色     */
  color         : #ffffff;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  box-shadow    : 6px 6px 3px #cccccc;  /* 影の設定 */
  border        : 2px solid #000066;    /* 枠の指定 */
}
.printwaku{
	border: 1px solid #000000;
}
/*サーバからクライアントへメッセージ送信*/
.s_c_textarea_seitono {
	border: 2px solid #e6c0eb;  /* 枠線 */
    border-radius: 0.67em;   /* 角丸 */
    padding: 0.5em;          /* 内側の余白量 */
    background-color: #fdebff;  /* 背景色 */
    font-size: 1em;          /* 文字サイズ */
    line-height: 1.2;        /* 行の高さ */
}
.s_c_textarea {
	border: 2px solid #edc7ab;  /* 枠線 */
    border-radius: 0.67em;   /* 角丸 */
    padding: 0.5em;          /* 内側の余白量 */
    background-color: #fce7d7;  /* 背景色 */
    font-size: 1em;          /* 文字サイズ */
    line-height: 1.2;        /* 行の高さ */
}
.s_c_send{
  display       : inline-block;
  border-radius: 0.67em;   /* 角丸 */
  font-size     : 12pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 8px 20px;   /* 余白       */
  margin       : 0px 20px;   /* 余白       */
  background    : #84e39f;     /* 背景色     */
  color         : #000000;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  border        : 2px solid #57b371;    /* 枠の指定 */
}
.s_c_cancel{
  display       : inline-block;
  border-radius: 0.67em;   /* 角丸 */
  font-size     : 12pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 8px 20px;   /* 余白       */
  margin       : 0px 20px;   /* 余白       */
  background    : #d8f2df;     /* 背景色     */
  color         : #000000;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  border        : 2px solid #57b371;    /* 枠の指定 */
}

.ImgBox{
  width: 25px;
  height: 25px;
}
.ImgBox-Img{
  transition-duration: 0.1s;
}
.ImgBox-Img:hover{
  transform: scale(2.5);
  transition-duration: 0.1s;
}
.read_label{
	cursor: pointer;
}

/*ComboBox*/
.select {
  width: 250px;
  height: 30px;
  border: 1px solid #000066;
  border-radius: 0.3em;
  background-color: #d4feff;
  color: #000000;
  font-size: 15px;
  margin 	: 0px 0px 10px 0px;   /* 余白       */
}
.selectpara {
  width: 50px;
  height: 30px;
  border: 1px solid #000066;
  border-radius: 0.3em;
  background-color: #ffffff;
  color: #000000;
  font-size: 15px;
  margin 	: 0px 0px 10px 0px;   /* 余白       */
}
.selectgroup {
  width: 100px;
  height: 30px;
  border: 1px solid #000066;
  border-radius: 0.3em;
  background-color: #ffffff;
  color: #000000;
  font-size: 15px;
  margin 	: 0px 0px 10px 0px;   /* 余白       */
}
/*更新ボタン*/
.updatebtn{
  display       : inline-block;
  border-radius: 0.67em;   /* 角丸 */
  font-size     : 12pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 8px 20px;   /* 余白       */
  margin       : 0px 20px 10px 20px;   /* 余白       */
  background    : #ffee00;     /* 背景色     */
  color         : #000000;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  border        : 2px solid #000066;    /* 枠の指定 */
}
/*Deleteボタン*/
.deletebtn{
  display       : inline-block;
  border-radius: 0.67em;   /* 角丸 */
  font-size     : 12pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 5px;   /* 余白       */
  margin       : 10px 20px 10px 20px;   /* 余白       */
  background    : #cfffd3;     /* 背景色     */
  color         : #000000;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  border        : 2px solid #18701e;    /* 枠の指定 */
}
#parablock_fulltime{
  margin 	: 10px 0px 0px 0px;   /* 余白       */
}
/**/
.paratitle {
  position: relative;
  padding: 0.5rem 3.5rem;
}

.paratitle:after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 6px;
  content: '';
  border-radius: 3px;
  background-image: -webkit-gradient(linear, right top, left top, from(#2af598), to(#009efd));
  background-image: -webkit-linear-gradient(right, #2af598 0%, #009efd 100%);
  background-image: linear-gradient(to left, #2af598 0%, #009efd 100%);
}
.read_label{
	cursor: pointer;
}
.netnoip{
	width: 50px;
}

/*整列アイコンの背景*/
.iconback{	
  border-radius: 0.67em;   /* 角丸 */
  text-align    : center;      /* 文字位置   */
  padding       : 0px;   /* 余白       */
  margin       : 0px 0px 5px 0px;   /* 余白       */
  background    : #e8ecff;     /* 背景色     */
  transition    : .3s;         /* なめらか変化 */
}