@charset "utf-8";

/*============================================
PC板
============================================*/
@media screen and (min-width:641px) {
    
/*============================================
色の変更
============================================*/
body {
    background-color: #eeeeee;
}

div#headerbody {
    background-color:#dddddd;
}

h4 {
    background-color: #191970;
    color: #ffffff;
    border-bottom: solid 3px #ffff00;
}

div#library_submenu h2 a {
    background-color: #191970;
    color:#ffffff;
}

div#library_submenu h2 a:hover {
    background-color: #161666;
}

hr {
    border:1px dotted #ffff00;
}

h5 {
    border-left: solid 3px #191970;/*左線*/
}

a#link {
    color: #161666;
    }
    
a#link:hover {
    color: #aa1666;
    text-decoration: none;
    }
    
div.headerborder {
    background-color:#191970;
}

div#card {
    background-color:#eeeeee;		/*背景色*/
    border:2px solid #191970;
}

div#card:hover {
    background-color:#dddddd;      /*カーソルを合わせると色が変わる*/
    border:2px solid #161666;
}

/*============================================
メインメニュー
============================================*/
div#menubody {
    background-color:#191970;
}

.menu li {
    background-color:#191970;		/*背景色*/
}

.menu li a {
	color:#ffffff;			/*文字色*/
}

.menu li ul a {
	color:#ffffff;			/*文字色*/
}

.menu ul {
    background-color:#191970;		/*背景色*/
	color:#ffffff;			/*文字色*/
}

.menu li:hover {
    background-color: #161666;      /* カーソルを合わせると色が変わる */
    transition-duration: 0.2s;      /*色が変わる時間*/
}
    
/*============================================
各話カード
============================================*/

div#smallcard {
    margin:0;
    background-color: #eeeeee;
    border:3px solid #191970;
}

div#smallcard:hover {
    background-color:#dddddd;
    border:3px solid #161666;
}
    
/*============================================
「前の話へ」「次の話へ」ボタン
============================================*/
    
div#prev-next_episode a {
    border:3px solid #191970;
}

div#prev-next_episode a p {
    color:#333333;
}

div#prev-next_episode a#prev_episode:hover,#next_episode:hover {
    background-color: #dddddd;
    border:3px solid #161666;
}

div#prev-next_episode a#prev_episode_unpublish {
    background-color: #aaaaaa;
    border:3px solid #131333;
}

div#prev-next_episode a#next_episode_unpublish {
    background-color: #aaaaaa;
    border:3px solid #131333;
}
}



/*============================================
スマホ版
============================================*/
@media screen and (max-width:640px) {
    
/*============================================
色の変更
============================================*/
body {
    background-color: #eeeeee;
}

div#headerbody {
    background-color:#dddddd;
}

h4 {
    background-color: #191970;
    color: #ffffff;
    border-bottom: solid 3px #ffff00;
}

div#library_submenu h2 a {
    background-color: #191970;
    color:#ffffff;
}

div#library_submenu h2 a:hover {
    background-color: #161666;
}

hr {
    border:1px dotted #ffff00;
}

h5 {
    border-left: solid 3px #191970;/*左線*/
}

a#link {
    color: #161666;
    }
    
a#link:hover {
    color: #aa1666;
    text-decoration: none;
    }
    
div.headerborder {
    background-color:#191970;
}

div#card {
    background-color:#eeeeee;		/*背景色*/
    border:2px solid #191970;
}

div#card:hover {
    background-color:#dddddd;      /*カーソルを合わせると色が変わる*/
    border:2px solid #161666;
}

/*アイコンのスペース*/
#nav-open {
    background-color: #191970;
}

#mobilemenu-content ul.menu li {
    background-color:#191970;		/*背景色*/
    border-bottom:solid 3px #ffff00;
}

#mobilemenu-content {
  background: #dddddd;/*背景色*/
}
#mobilemenu-content ul.menu li:hover {
    background-color: #161666;      /* カーソルを合わせると色が変わる */
    transition-duration: 0.2s;      /*色が変わる時間*/
}

#mobilemenu-content ul.menu li.main {
    background-color: #131333;
}
    
/*============================================
各話カード（モバイル）
============================================*/   

div#smallcard {
    border-bottom: 3px solid #191970;
    background-color:#eeeeee;
}

div#smallcard:hover {
    border-bottom: 3px solid #161666;
    background-color:#dddddd;
}

/*============================================
「前の話へ」「次の話へ」ボタン
============================================*/
    
div#prev-next_episode a {
    border:3px solid #191970;
}

div#prev-next_episode a p {
    color:#333333;
}
    
div#prev-next_episode a#prev_episode:hover,#next_episode:hover {
    background-color: #dddddd;
    border:3px solid #161666;
    transition-duration: 0.2s
}

div#prev-next_episode a#prev_episode_unpublish {
    background-color: #aaaaaa;
    border:3px solid #131333;
}

div#prev-next_episode a#next_episode_unpublish {
    background-color: #aaaaaa;
    border:3px solid #131333;
    margin:0 0 0 auto;
}

}