/*******************************************************************************
 * 【ｼｽﾃﾑ】
 *  AI小論ナビ
 *
 * 【機能概要】
 *  CSSﾌｧｲﾙ
 *
 * --------------------------------------------------------------------------- *
 * 【変更履歴】
 *  2016/10/27; 新規作成;
 *
 *******************************************************************************/
/***** カラー *****
 * ﾒｲﾝｶﾗｰ:#001e62(濃い目の青) ｱｸｾﾝﾄｶﾗｰ1:#f1c400(黄土色) ｱｸｾﾝﾄｶﾗｰ2:#C63527(えんじ色)
 * background-color:#001e62;
 * border: 1px #001e62 solid;
*******************/

/*--------------------------------------------------------------*/
/* 基本                                                         */
/*--------------------------------------------------------------*/
* {
  margin: 0;
  padding:0;
  vertical-align:middle; /* 文字の上下位置を設定(垂直方向の中心に揃える)する */
}

/*--------------------------------------------------------------*/
article, aside, figure, figcaption, footer, header, hgroup, nav, section
{
  display:block;
}

/*--------------------------------------------------------------*/
body {
  -webkit-text-size-adjust:100%;
  font-family:Arial,sans-serif;
  font-size:14px;
  line-height:1.4; /*行間 単位有の場合には計算値が、単位無の場合には指定値が継承される*/
  Letter-Spacing:1px; /* 文字間 */
  width:98%;
/*  width:100%;*/
  margin:0 auto;
  border-top:1px solid #001e62;
  border-bottom:1px solid #001e62;
  border-left:1px solid #001e62;
  border-right:1px solid #001e62;

  /*background-color:#fdf5e6;*/ /* oldlace */

}

@media screen and (min-width:640px){  
  body {
    width:640px;
  }
}  


/*--------------------------------------------------------------*/
a {
  color:           #001e62;
  text-decoration: underline;
}
a:visited {
  color:           #001e62;
  text-decoration: underline;
}
a:hover {
  color:            #ff0000;
  background-color: #d3d3d3; 
  text-decoration:  underline;
}
/**
input {
  width:100%;
}
**/

/**/
input[type="radio"] {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
}
/**/

/***** ボタンの角丸を解除(iphone対策)*****
input[type="button"],input[type="submit"] {
  -webkit-appearance: none;
  border-radius: 0;
}
********************************************/

/***** ボタンを角丸にする *****/
input[type="button"],input[type="submit"] {
  -webkit-appearance: none;
  border-radius: 50px;
}
/******************************/

/*--------------------------------------------------------------*/
table {
  border: 1px #000000 solid;
  border-collapse: collapse;
  border-spacing: 0px;
}
td {
  border: 1px #000000 solid;
  padding: 2px 2px; /*[上下][左右]*/
}
/*--------------------------------------------------------------*/
.tableStart {
  width:100%;
  display:table;
}

.tableLeft {
  display:table-cell;
  text-align:left;
}

.tableRight {
  display:table-cell;
  text-align:right;
}

/*--------------------------------------------------------------*/
/* 画面内共通                                                   */
/*--------------------------------------------------------------*/
/*----- 区切スペース -----*/
div.space10 {
  height:10px;
}
div.space20 {
  height:20px;
}
/*----- ボタンエリア -----*/
div.btn_area {
  width:auto;
  text-align:center;
  margin-top:20px;
}
div.btn_area p {
  font-size:13px;
  text-align:center;
  vertical-align: text-bottom;
}
/*----- アンカーエリア -----*/
div.anc_area {
  width:auto;
  font-size:13px;
  text-align:left;
  margin-top:20px;
  margin-left:10px;
  margin-bottom:20px;
}
div.anc_area p {
  font-size:13px;
  text-align:center;
  vertical-align: text-bottom;
}
div.anc_area span.anc {  /* ｱﾝｶｰ代替15p */ 
  cursor:pointer;
  color:#001e62;
  font-size:15px;
  text-decoration: underline;
}
div.anc_area span.anc:visited {
  color:           #001e62;
  text-decoration: underline;
}
div.anc_area span.anc:hover {
  color:            #ff0000;
  background-color: #d3d3d3;
  text-decoration:  underline;
}
/*----- 選択エリア -----*/
div.sel_area {
/*  width:300px;*/
  width:auto;
  text-align:left;
  margin-top:20px;
  margin-left:10px;
}
div.sel_area select.sel1{
  width:auto;
  text-align:left;
  vertical-align:top;
  margin-left:10px;
  margin-bottom:10px;
}

/*----- タイトル帯1(背景ﾒｲﾝｶﾗｰで塗潰し 16p) -----*/
div.obi1 {
  width:auto;
  color:#ffffff;  /* white */
  background-color:#001e62;
  border: 1px #001e62 solid;
  text-align:left;
  font-size:16px;
  font-weight:bold;
  padding-top:4px;
  padding-left:4px;
}
/*----- タイトル帯2(背景ｱｸｾﾝﾄｶﾗｰ1で塗潰し 15p) -----*/
div.obi2 {
  width:auto;
  color:#000000;  /* black */
  background-color:#f1c400;
  border: 1px #f1c400 solid;
  text-align:left;
  font-size:15px;

  margin-top:2px;

  padding-top:4px;
  padding-left:4px;
}
div.obi2 span {
  color:#C63527;
  font-size:15px;
  font-weight:bold;
  vertical-align:top;
}

/*----- タイトル帯3(ﾒｲﾝｶﾗｰ上下線のみ 15p) -----*/
div.obi3 {
  width:auto;
  color:#001e62;

  font-size:15px;
  text-align:left;
  font-weight:bold;

  border-top:   2px solid #001e62;
  border-bottom:2px solid #001e62;

  margin-top:4px;

  padding-top:4px;
  padding-left:4px;
  padding-bottom:2px;
}

/*----- 枠1(枠線なし13p) -----*/
div.Waku1 {
  width:auto;
  text-align:center;
  vertical-align:top;

  margin-top:10px;
  margin-bottom:10px;

  padding-left:4px;
  padding-right:4px;

  border-style:none;
}

div.Waku1 p {
  font-size:13px;
  text-align:left;
}
div.Waku1 p.p13s {   /* スクロール表示 */ 
  overflow-y:scroll;
  height: 100px;
  font-size:13px;
  text-align:left;
}
div.Waku1 p.p13rb {  /* えんじ13pｶﾗｰ太字 */ 
  color:#C63527;
  font-size:13px;
  font-weight:bold;
}
div.Waku1 p.p15b {  /* ﾒｲﾝｶﾗｰ15p太字 */ 
  color:#001e62;
  font-size:15px;
  font-weight:bold;
}

div.Waku1 span {  /* えんじ13pｶﾗｰ太字 */ 
  color:#C63527;
  font-size:15px;
  font-weight:bold;
  vertical-align:top;
}

div.Waku1 span.s26b {  /* えんじ26pｶﾗｰ太字 */ 
  color:#C63527;
  font-size:26px;
  font-weight:bold;
  vertical-align:middle;
}

/*----- 枠2(背景ｱｸｾﾝﾄｶﾗｰ1で塗潰し 13p) -----*/
div.Waku2 {
  width:300px;
  color:#000000;  /* black */
  background-color:#f1c400;
  border: 1px #f1c400 solid;

  text-align:center;
  vertical-align:top;

  margin-top:10px;
  margin-bottom:10px;
  margin-left:auto;
  margin-right:auto;

  padding-left:4px;
  padding-right:4px;

  border-style:none;
}
div.Waku2 p {
  font-size:13px;
  text-align:left;
}

/*----- 枠3(枠有り 13p) -----*/
div.Waku3 {
  width:80%;
  text-align:center;
  vertical-align:top;

  border:2px #001e62 solid;

  margin-top:10px;
  margin-bottom:10px;
  margin-left:auto;
  margin-right:auto;

  padding-left:4px;
  padding-right:4px;
}

div.Waku3 p {
  font-size:13px;
  text-align:left;
}


div.Waku3 span.und {  /* えんじ26pｶﾗｰ太字 */ 
  font-size:13px;
  vertical-align:bottom;
  text-decoration: underline;
}

/*--------------------------------------------------------------*/
/* 学部別傾向分析 画面            */
/*--------------------------------------------------------------*/
table.keikou {
  border: 2px #001e62 solid;
  margin-top:6px;
  margin-left:10px;
}
table.keikou td {
  border: 2px #001e62 solid;
}

/*--------------------------------------------------------------*/
/* 本格添削 画面            */
/*--------------------------------------------------------------*/
p.arrow {
  font-size:26px;
  color:#001e62;
  text-align:center;
  font-weight:bold;
  margin-top:-10px;
  margin-left:0px;
}



/*--------------------------------------------------------------*/
/* ヘッダー関連            */
/*--------------------------------------------------------------*/
#header {
  display:table;
  width:100%;
}
#header h2 {  /* pubLeftTitle */
  display:table-cell;
  font-size:16px;
  text-align:left;
  color:#001e62;
  padding-left:4px;
}
#header h3 {  /* pubRightTitle(UserId) */
  font-size:14px;
  display:table-cell;
  text-align:right;
  color:#C63527;
  padding-right:4px;
}

/*--------------------------------------------------------------*/
/* タイトル関連(未使用)            */
/*--------------------------------------------------------------*/
#maintitle {
  color:#ffffff;  /* white */
  background-color:#4472c4;
  text-align:left;
  font-size:16px;
  font-weight:bold;
  padding-top:4px;
  padding-left:10px;
}

/*--------------------------------------------------------------*/
/* コンテンツ関連            */
/*--------------------------------------------------------------*/
#contents {
  width:100%;
  margin-top:2px;
  margin-bottom:10px;
  margin-left:auto;
  margin-right:auto;

  /** DEBUG **/
  /*background-color:#ffff00;*/ /* yellow */
}

/*--------------------------------------------------------------*/
/* フッター関連            */
/*--------------------------------------------------------------*/
#footer {
  width:100%;
  font-size:13px;
  text-align:center;
  vertical-align: text-bottom;

  /** DEBUG **/
  /*background-color:#ffe4c4;*/ /* bisque */
}

/*--------------------------------------------------------------*/
/* ログイン関連            */
/*--------------------------------------------------------------*/
#loginarea {
  width:296px;
  margin:0 auto;
}

#loginarea table.loginPtn {
  width:100%;
  border: 1px #001e62 solid;
  margin:0px auto;
  margin-top:6px;
}

#loginarea table.loginPtn td {
  border: none;
}

#loginarea input.loginBtn {
  width:240px;
  height:40px;
  font-size:16px;
  font-weight:bold;
  text-align:center;

  color:#ffffff;  /* white */
  background-color:#001e62;
  border: 1px #001e62 solid;

  margin-top:6px;
  margin-bottom:6px;
  padding:2px 4px;
}


/*--------------------------------------------------------------*/
/* 問題回答関連            */
/*--------------------------------------------------------------*/
#tyui {
  width:100%;

  font-size:12px;
  margin-top:2px;
  margin-bottom:5px;
  margin-left:3px;
  margin-right:auto;

  /** DEBUG **/
  /*background-color:#ffa500;*/ /* orange */
}

#setumei {
  width:100%;

  font-size:13px;
  font-weight:bold;
  margin-top:5px;
  margin-bottom:5px;
  margin-left:3px;
  margin-right:auto;

  /** DEBUG **/
  /*background-color:#ffa500;*/ /* orange */
}

#storyjump {
  width:100%;

  font-size:14px;
  margin-top:5px;
  margin-bottom:5px;
  margin-left:5px;
  margin-right:auto;

  /** DEBUG **/
  /*background-color:#ffa500;*/ /* orange */
}

#storyjump p {
  font-size:10px;
}

#qaArea {
  width:99%;

  font-size:13px;
/*  line-height: 1.3;*/
  margin-top:2px;
  margin-bottom:10px;
  margin-left:auto;
  margin-right:auto;

  /** DEBUG **/
  /*background-color:#ffb6c1;*/ /* lightpink */
}

#QueArea {
  border:2px #001e62 solid;
  margin-top:10px;
  margin-bottom:6px;
  margin-left:auto;
  margin-right:auto;

  padding-top:   5px;
  padding-bottom:5px;
  padding-left:2px;
  padding-right:1px;

  /** DEBUG **/
  /*background-color:#ffa07a;*/ /* lightsalmon */
}

#AnsArea {
  line-height:1.8;

  margin-top:10px;
  margin-bottom:6px;
  margin-left:auto;
  margin-right:auto;
  padding-left:2px;

  /** DEBUG **/
  /*background-color:#7fffd4;*/ /* aquamarine */
}

#pRadio {
  text-align:left;
  padding:2px 10px;
}


#AnsAreaRed { /** 添削結果用 **/
  line-height:1.8;

  color:#C63527;
  font-size:15px;
  font-weight:bold;
  vertical-align:top;

  margin-top:10px;
  margin-bottom:6px;
  margin-left:auto;
  margin-right:auto;
  padding-left:2px;

  /** DEBUG **/
  /*background-color:#7fffd4;*/ /* aquamarine */
}

#pRadioRed {
  color:#C63527;
  text-align:left;
  padding:2px 10px;
}

/*--------------------------------------------------------------*/
/* 新特性結果表示画面                                           */
/*--------------------------------------------------------------*/

/*----- 区画 -----*/
div.New_TokuseiArea {
  width:98%;

  margin-top:10px;
  margin-bottom:0px;
  margin-left:auto;
  margin-right:auto;

  padding-top:4px;
  padding-bottom:4px;
}

/*----- -----*/
table.New_Tokusei {
  width:100%;

  border-style:none;

  border-collapse: separate;
  border-spacing: 0;
  cellspacing: 0;

  margin-top:10px;

  margin-left:auto;
  margin-right:auto;
}

/*----- 中央空白 -----*/
td.New_Toku_C {
  width:10px;
  border-style:none;
}

/*----- 左側1 -----*/
td.New_Toku_L1 {
  width:20px;

  font-size:14px;
  font-weight:bold;
  text-align:center;

  color:#ffffff;  /* white */
  background-color:#000000; /* black */
  border: 1px #000000 solid;
}

/*----- 左側2 -----*/
td.New_Toku_L2 {
  width:20px;

  font-size:14px;
  font-weight:bold;
  text-align:center;
}

/*----- 右側エリア -----*/
td.New_Toku_R_AREA {
  width:auto;
  border-style:none;
}

/*----- 右側画像 -----*/
td.New_Toku_R_Gazo {
  width:auto;
  text-align:center;
  vertical-align:top;

  margin-top:10px;
  margin-bottom:10px;
  margin-left:auto;
  margin-right:auto;

  border-style:none;
}

/*----- 右側タイプタイトル -----*/
td.New_Toku_R_Title {
  font-size:16px;
  font-weight:bold;
  text-align:left;

  border-style:none;

  background-color:#d3d3d3; /* lightgrey */
}

/*----- 右側タイプ内容 -----*/
td.New_Toku_R_Naiyou {
  font-size:14px;
  text-align:left;
}


/*--------------------------------------------------------------*/
/* 共通ボタン関連            */
/*--------------------------------------------------------------*/
input.NextBtn {
  width:300px;
  color:#ffffff;  /* white */
  font-size:16px;
  font-weight:bold;
  text-align:center;
  background-color:#001e62;
  border: 1px #001e62 solid;

  margin-top:8px;
  margin-bottom:8px;

  padding-top:6px;
  padding-bottom:4px;
  padding-left:10px;
  padding-right:10px;
}

input.NextBtn2 { /*----- (枠のみで塗潰しなし 16p) -----*/
  width:300px;
  color:#4472c4;
  font-size:16px;
  font-weight:bold;
  text-align:center;

  background-color:#ffffff;
  border: 2px #4472c4 solid;

  margin-top:8px;
  margin-bottom:8px;

  padding-top:6px;
  padding-bottom:4px;
  padding-left:10px;
  padding-right:10px;
}

input.OutBtn {
  width:300px;
  color:#808080;  /* gray */
  font-size:16px;
  font-weight:bold;
  text-align:center;
  background-color:#b4c7e7;
  border: 1px #b4c7e7 solid;

  margin-top:8px;
  margin-bottom:8px;
  padding-top:6px;
  padding-bottom:4px;
  padding-left:10px;
  padding-right:10px;
}

input.BackBtn { /*１つ前に戻る*/
  width:300px;
  color:#ffffff;  /* white */
  font-size:16px;
  font-weight:bold;
  text-align:center;
  background-color:#4472c4;
  border: 1px #4472c4 solid;

  margin-top:8px;
  margin-bottom:8px;
  padding-top:6px;
  padding-bottom:4px;
  padding-left:10px;
  padding-right:10px;
}

input.errBtn {
  width:210px;
  color:#ff0000;  /* red */
  font-size:16px;
  font-weight:bold;
  text-align:center;
  background-color:#e6e6fa; /* lavender */
  border: 1px #e6e6fa solid;

  margin-top:20px;

  padding-top:6px;
  padding-bottom:4px;
  padding-left:6px;
  padding-right:6px;
}

/*--------------------------------------------------------------*/
/* エラー画面関連            */
/*--------------------------------------------------------------*/
#errarea {
  width:100%;
  margin:0 auto;
  color:#ff0000;  /* red */
  text-align:center;
}
#errtitle {
  border:1px #ff0000 solid;  /* red */
  text-align:left;
  font-size:16px;
  font-weight:bold;
  background-color:#e6e6fa; /* lavender */
  padding-top:6px;
  padding-bottom:6px;
  padding-left:10px;
}
#errmsg {
  border:1px #ff0000 solid;  /* red */
  text-align:left;
  font-size:14px;
  font-weight:bold;
  padding:6px 10px;
}

/**** メモ
【justifyの指定について】
複数行に渡る長い文章の場合に、各行（最終行を除く）の右端が綺麗に揃うように単語間隔が自動的に調整されます。（英文などの場合に有効のようです）

***/