@charset "UTF-8";

body
{margin:0;
font-family:'メイリオ','Hiragino Kaku Gothic Pro', sans-serif}


/* サイト名 */

.site h1 a{color:#666;
text-decoration: none}

.site h1{margin:0;
font-size:20px}

.site img {border:none}


/*リンク カラー */

a:link {color: #666666;
text-decoration:none}
a:visited {color: #666666}
a:hover {color: #ff0000}
a:active {color:#ff8000}



/* ヘッダー画像 */

.topimg		{width:100%;
			height:auto;
			vertical-align: bottom}


/* コピーライト */

.copyright p	{margin:0;
				color:#666666;
				font-size:14px}


/* トップに戻る ボタン */

.pagetop {
display: none;
position: fixed;
bottom: 30px;
right: 15px;
}
.pagetop a {
	display: block;
	background-color: #000;
	text-align: center;
	color: orange;
	font-size: 30px;
	text-decoration: none;
	padding: 8px 13px;
	filter: alpha(opacity=50);
	-moz-opacity: 0.5;
	opacity: 0.5;
}
.pagetop a:hover {
display: block;
background-color: #000;
text-align: center;
color: #fff;
font-size: 30px;
text-decoration: none;
padding:8px 13px;
	filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
}

/* BOX A の下に罫線を挿入 (コンテンツページのみ) */


.contents .boxA
{border-bottom: solid 1px #dddddd}

/* BOX5をバーの形にする */

.box5
{padding-top:15px;
padding-bottom:15px;
background-color: #dddddd}

/* ボックスの左右 */
.boxA,.box5,.box7{ /* box7 メインコンテンツ内 */    
padding-right:25px;  /* ヘッダー/フッター/計算フォーム 横幅指定 */
padding-left:15px}


/* ボックスの上下 */

.boxA{padding-top:20px;
padding-bottom:10px}

.box7{padding-top: 25px;
padding-bottom:25px}


/* ### 359px 以下 ### */

@media (max-width:359px){

/* サイト名 */

.site img{width:225px;
height:auto}

}
/* BOX Aの背景 */

.boxA{background-color: #fcf9ed}


/* ### 599px 以下 ### */


@media (max-width:599px){


/* ナビゲーション */


.menu li a
{padding: 10px 7px;
font-size: 11px}


/* キャッチコピー */


.catch{padding:5px 10px;
font-size:12px}

/* 記事 */
.content h1{font-size: 26px}


.content .lead{font-size: 16px}

}


/* ### 767px 以下 ### */


@media (max-width:767px){


/* トグルボタン */


#menubtn{padding:6px 12px;
border:solid 1px #aaaaaa;
border-radius:5px;
background-color: #ffffff;
position: absolute;
top:10px;
right:3px; /* ボタン左側の空きスペース */
cursor: pointer}


#menubtn:hover{background-color: #dddddd}
    
#menubtn:focus{outline:none}
    
#menubtn i{color:#888888;
font-size:18px}

#menubtn span{display:inline-block;
text-indent: -9999px}


/* ナビゲーションメニュー (縦並び) */


#menu{display: none}

.menu ul{margin: 0;
padding: 0;
list-style: none}


.menu li a{display: block;
padding: 5px;
color: #000000;
font-size: 14px;
text-decoration: none}


.menu li a:hover{
background-color: #eeeeee}


}

/* ### 768px 以上 ### */

@media(min-width: 768px){


/* トグルボタン */

#menubtn{display: none}


/* ナビゲーション */


#menu{display: block !important}


.menu ul{margin: 0;
padding: 0;
list-style: none}


.menu li a{display: block;
padding: 10px 15px;
color: #000000;
font-size: 14px;
text-decoration: none}


.menu li a:hover{
background-color: #eeeeee}


.menu ul:after{content: "";
display: block;
clear: both}


.menu li{float: left;
width: auto}


/* BOX1とBOX2を横に並べる設定 */


.boxA:after{content:"";
display:block;
clear:both}


/* ヘッダー表示している部分 */
.box1{float:left;
width:auto}

    
    
/* トグルボタンを表示している位置 */
.box2{float:right;
width:auto}


}

/* ### 1190px 以上 ### */


@media(min-width:1190px){


/* 全体の横幅を固定 */

.box3, .boxA-inner, .box5-inner, .box6, .box7{
width:1140px;
margin-left:auto;
margin-right:auto}


/* BOX Aの下に罫線を挿入 */
.boxA{margin-bottom: 20px;
border-bottom: solid 1px #dddddd}

}

ul {
display: block;
unicode-bidi: isolate;
margin-top: 1em;
margin-bottom: 1em;
padding-left: 40px;
list-style-type: square
}



/* データベース内のコンテンツ用 (下層)*/
.database h1{
margin-top: 0px;
margin-bottom: 5px;
border-bottom: solid 1px #dddddd;
font-size: 24px;
font-weight: normal
}

.database h2{
margin-top: 30px;
margin-bottom: 20px;
padding-left: 20;
font-size: 17px;
font-weight: normal;
border-bottom: 1px solid #dddddd;
border-left-width: 10px;
border-left-style: solid;
border-left-color: #c50018;
padding-left: 10px;
}

.database h2 i{margin-right: 7px;
color: #888888}

.database h3{
margin-top: 0px;
margin-bottom: 15px;
color: #366;
font-size: 16px;
border-bottom: solid 1px #dddddd;
background-color: #f3f3f3;
padding: 10px;
}


.database img{
max-width: 100%;
height: auto;
margin-bottom: 10px;
padding-top: 10px
}


.database-link {border-bottom:dotted 1px #333}


/*データベースページ内部のコンテンツ共通 (下層)*/


.database p{
max-width:1000px;
margin-top: 0;
margin-bottom: 20px;
line-height: 1.5em
}

.database section{color:#eb5c01}


 /*解説部分box */
 

.system-box {
	padding: 0.5em 1em;
	margin: 2em 0;
	font-weight: bold;
	color: #000000;/*文字色*/
	background: #ffffe0;
	border: solid 3px #2f4f4f;/*線*/
	border-radius: 10px
}
.system-box p {
	font-weight:bold;
    margin: 0; 
    padding: 0
}



ul li{line-height:1.5em;
padding: 0.5em 0 /*前後の文との余白*/
}
 

.database section{color:#eb5c01}



 /*サーヴァントリスト */
 
[class^="img-flex-"] {
	margin-bottom: 5px;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}

.img-flex-2 > img,
.img-flex-2 a { width: 49%; }
.img-flex-3 > img,
.img-flex-3 a { width: 32%; }
.img-flex-4 > img,
.img-flex-4 a { width: 24%; }


/* 計算フォーム用 レスポンシブ調整 */

select,
textarea,
button,{
-moz-appearance: none;
-webkit-appearance: none;
-webkit-box-shadow: none;
box-shadow: none;
outline: none;
border: none;
}


/* チェックボックスの設定 */

.chkbox div{
    padding-top:5px;
    border-bottom: 1px solid #d7d7d7;
    font-size:20px
}


.chkbox p{
    
    font-size:20px}

@import 'compass';

input[type=checkbox] {
  @include scale(1.5);
}
input[type=checkbox] {
    margin:20px;
  -ms-transform: scale(1.5, 1.5);
  -webkit-transform: scale(1.5, 1.5);
  transform: scale(2, 2);
}

/* 計算ボタン　サイズ*/


input[type="button"],
textarea {
background: #fff;
display: block;
font-size: 18px;
padding:5px;
margin:0px 5px 0px 5px;
width: 100%;
transition: 0.8s;
border-radius: 0;
}
 
input[type="button"]:focus,
textarea:focus {
background: #e9f5fb;
width:100%;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

/*リセットボタン サイズ */

input[type="reset"],
textarea {
background: #fff;
display: block;
font-size: 18px;
padding:5px;
margin:0px 5px 0px 5px;
width: 100%;
transition: 0.8s;
border-radius: 0;
}
 
input[type="reset"]:focus,
textarea:focus {
background: #e9f5fb;
width:100%;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

table {
border-collapse: collapse;
}

/* 宝具ダメージ 計算フォーム */


.form-table {
width: 100%;
}
 
.form-table th,
.form-table td {
border-bottom: 1px solid #d7d7d7;
padding: 5px 0px 5px 10px;
margin:15px;
}
 

/* 宝具 TOTALダメージ 表示 */

.total_damage{
text-align: center;}





/* 蓄積ダメージ内 1hit毎のヒット数のフォント指定 */

td.hit_number{

font-size: 20px;}


/* th テーブル共通の背景 */
.form-table th {

background:#3D5A6C;
color:#fff;
position: relative;
font-size:18px;
text-align:left;
}

.form-table th,
.form-table td {
display: block;
width: 100%;
border-bottom: none;
}
 
.form-table {
margin-left: -20px;
width: 100%;
}
 
.form-table select{
background: #f0f0f0;
display: block;
font-size: 25px;
padding: 5px 0px 5px 10px;
width: 100%;
transition: 0.8s;
border-radius: 0;
}

.form-table input{
background: #f0f0f0;
display: block;
font-size: 25px;
padding: 5px 0px 5px 5px; 
width: 100%;
transition: 0.8s;
border-radius: 0;
}

/* ATK マニュアル値 */

#ATK_manual {
font-size: 25px;
display: block;
width: 100%;
border: 2px solid #999;
padding: 5px 0px 5px 10px;
margin:5px;
background: #f0f0f0;
}

/* エネミー設定[A] table */


.form-table_EnemyA {
width: 100%;
}
 
.form-table_EnemyA th,
.form-table_EnemyA td {
border-bottom: 1px solid #d7d7d7;
padding: 5px 0px 5px 10px;
margin:15px;
}
 

/* th テーブル共通の背景 */
.form-table_EnemyA th {

background:#ff9933;
color:#000;
position: relative;
font-size:18px;
text-align:left;
}

.form-table_EnemyA th,
.form-table_EnemyA td {
display: block;
width: 100%;
border-bottom: none;
}


.form-table_EnemyA th,
.form-table_EnemyA td {
display: block;
width: 100%;
border-bottom: none;
}
 
.form-table_EnemyA {
margin-left: -20px;
width: 100%;
}
 
.form-table_EnemyA select{
background: #f0f0f0;
display: block;
font-size: 25px;
padding: 5px 0px 5px 10px;
width: 100%;
transition: 0.8s;
border-radius: 0;
}

.form-table_EnemyA input{
background: #f0f0f0;
display: block;
font-size: 25px;
padding: 5px 0px 5px 0px;
width: 100%;
transition: 0.8s;
border-radius: 0;
}

/* エネミー設定[B] table */


.form-table_EnemyB {
width: 100%;
}
 
.form-table_EnemyB th,
.form-table_EnemyB td {
border-bottom: 1px solid #d7d7d7;
padding: 5px 0px 5px 10px;
margin:15px;
}
 

/* th テーブル共通の背景 */
.form-table_EnemyB th {

background:#198465;
color:#fff;
position: relative;
font-size:18px;
text-align:left;
}

.form-table_EnemyB th,
.form-table_EnemyB td {
display: block;
width: 100%;
border-bottom: none;
}


.form-table_EnemyB th,
.form-table_EnemyB td {
display: block;
width: 100%;
border-bottom: none;
}
 
.form-table_EnemyB {
margin-left: -20px;
width: 100%;
}
 
.form-table_EnemyB select{
background: #f0f0f0;
display: block;
font-size: 25px;
padding: 5px 0px 5px 10px;
width: 100%;
transition: 0.8s;
border-radius: 0;
}

.form-table_EnemyB input{
background: #f0f0f0;
display: block;
font-size: 25px;
padding: 5px 0px 5px 0px;
width: 100%;
transition: 0.8s;
border-radius: 0;
}

/* OUTPUT タグ */

output[type="number"],
textarea {
background: #fff;
display: block;
font-size: 23px;
padding: 0px 0px 0px 0px;
width: 98%;
transition: 0.8s;
border-radius: 0;
}
 
output[type="text"]:focus,
textarea:focus {
background: #e9f5fb;
width:100%;
}


/* 計算 結果 */

.result_NP {
width: 100%;
}
.result_NP th,
.result_NP td {
border-top: 1px solid #d7d7d7;
border-bottom: 1px solid #d7d7d7;
padding: 5px 0px 5px 15px;
margin:15px;
}
 
.result_NP th {
background-color:#F5F5D1;
color:#000;
position: relative;
font-size:18px;
text-align: left;
}

.result_NP th,
.result_NP td {
display: block;
width: 100%;
border-bottom: none;
}


.result_NP th,
.result_NP td {
display: block;
width: 100%;
border-bottom: none;
}
 
.result_NP {
margin-left: -20px;
width:100%;
}
 
/* NP出力 1hit あたり */

.result_NP_1HIT {
	width: 100%;
	}
	.result_NP_1HIT th,
	.result_NP_1HIT td {
	border-top: 1px solid #d7d7d7;
	border-bottom: 1px solid #d7d7d7;
	padding: 5px 0px 5px 15px;
	margin:15px;
	}
	 
	.result_NP_1HIT th {
	background-color:#2CA58D;
	color:#fff;
	position: relative;
	font-size:18px;
	text-align: left;
	}
	
	.result_NP_1HIT th,
	.result_NP_1HIT td {
	display: block;
	width: 100%;
	border-bottom: none;
	}
	
	
	.result_NP_1HIT th,
	.result_NP_1HIT td {
	display: block;
	width: 100%;
	border-bottom: none;
	}
	 
	.result_NP_1HIT {
	margin-left: -20px;
	width:100%;
	}



/* 蓄積ダメージ　フォーム */


.addition_form {
width: 100%;
}
 
.addition_form th,
.addition_form td {
border-bottom: 1px solid #d7d7d7;
padding: 5px 0px 5px 10px;
margin:15px;
}
 

/* th テーブル共通の背景 */
.addition_form th {

background:#666;
color:#fff;
border:solid #fff thin;
position: relative;
font-size:12px;
text-align:center;
}


.addition_form td{
text-align: center;}

 
.addition_form {
margin:0px;
width: 100%;
}
 
/* TOTALダメージ フォーム */


.total_dm_form {
width: 100%;
}
 
.total_dm_form th,
.total_dm_form td {
border-bottom: 1px solid #d7d7d7;
padding: 5px 0px 5px 10px;
margin:15px;
}
 

/* th テーブル共通の背景 */
.total_dm_form th {

background:#535965;
color:#fff;
position: relative;
font-size:12px;
text-align:center;
}


.total_dm_form td{
text-align: center;}

 
.total_dm_form {
margin:0px;
width: 100%;
}



/* TOTALバフ フォーム */


.total_buff_form {
	width: 100%;
	}
	 
	.total_buff_form th,
	.total_buff_form td {
	border-bottom: 1px solid #d7d7d7;
	padding: 5px 0px 5px 10px;
	margin:15px;
	}
	 
	
	/* th テーブル共通の背景 */
	.total_buff_form th {
	
	background:#2CA58D;
	color:#fff;
	position: relative;
	font-size:12px;
	text-align:center;
	}
	
	
	.total_buff_form td{
	text-align: center;}
	
	 
	.total_buff_form {
	margin:0px;
	width: 100%;
	}

	/* TOTAL NP計算 フォーム */

.total_np_form {
	width: 100%;
	} 
	.total_np_form th,
	.total_np_form td {
	border-bottom: 1px solid #d7d7d7;
	padding: 5px 0px 5px 10px;
	margin:15px;
	}
	 
	
	/* th テーブル共通の背景 */
	.total_np_form th {
	
	background:#f5f5d1;
	color:#000;
	position: relative;
	font-size:12px;
	text-align:center;
	}
	
	
	.total_np_form td{
	text-align: center;}
	
	 
	.total_np_form {
	margin:0px;
	width: 100%;
	}
/* バフ アイコン設定 */

img.icon{
    padding-left:15px;
    vertical-align: middle;}

/* 計算ボタン 位置 */

div#button_keisan{
    text-align: center;
    margin: 0px auto;}


/* システム 切り替え後のメッセージ表示 */

span{
    font-size:20px;
    color:#4682B4;
}

/* システムサポート用の画像 */

support_system{
    margin-right:15px
}

/* WAVE サポート別のNP表示 部分 */

div.Enemy_result{
    
font-size:18px;
border-bottom:dashed 0.5px #666;
}

/* WAVE NP結果 フォーム */

.wave_result-form {
width: 100%;
}
 
.wave_result-form th,
.wave_result-form td {
padding: 5px 0px 5px 10px;
margin:15px;
}
 

/* th テーブル共通の背景 */
.wave_result-form th {
background:#40434E;
color:#fff;
border:solid #666 thin;
position: relative;
font-size:12px;
text-align:center;
}

.wave_result-form td{
border:solid #666 thin;
text-align: center;
}

 
.wave_result-form {
margin:0px;
width: 100%;
}

/* NP配布 スキル 使用 テーブル */

.NPskill_form {
width: 100%;
}
 
.NPskill_form th,
.NPskill_form td {
border-bottom: 1px solid #d7d7d7;
padding: 5px 0px 5px 10px;
margin:15px;
}
 

/* th テーブル共通の背景 */
.NPskill_form th {
background:#FFE4C4;
color:#000;
border:solid #666 thin;
position: relative;
font-size:12px;
text-align:center;
}


.NPskill_form td{
border:solid #666 thin;
text-align: center;}

 
.NPskill_form {
margin:0px;
width: 100%;
}

/* WAVE毎の宝具発動後のresult表示部分 見出し */

div.NP_result_form  {
width: 100%;
background:#19647E;
color:#fff;
position: relative;
font-size:15px;
text-align:left;
margin-top:10px; 
padding: 5px 0px 5px 10px;
}

/* コマンドコード設定 */

th.CMD_Buster { 

background-color: #EF626C;
color:white;
}
	
th.CMD_Quick { 

	background-color: #366;
	color:white;
}


th.CMD_Arts { 

	background-color: #4682B4;
	color:white;
}

.count_skill {

	width:90px;
	height:auto;
	font-size:18px;
	margin-left:10px;
}

.Merlin_List{
    display:none;
}

.Skadi_List{
    display:none;
}

