@charset "UTF-8";

/*//////////////////////////////////////////////////

Title : course.css
For   : Setting base styles of the site

Created       : 2010-2-19
Last Modified :

/*===== CONTENTS ===========================================

	 1: COURSE001

==========================================================*/

/*======================================

	1: COURSE001

=======================================*/

body#COURSE001 dl.course_list {
	border-bottom: 2px #dddddd solid;
	margin-bottom: 20px;
}

body#COURSE001 dl.course_list dt {
	color: #CD396A;
	font-weight: bold;
	padding-bottom: 18px;
}

body#COURSE001 dl.course_list dd {
	padding-bottom: 20px;
}

/*body#COURSE001 .tab_navi{
	margin-bottom: 10px;
	padding: 0;
	width: 440px;
	height: 35px;
}

body#COURSE001 .tab_navi ul{
	margin: 0;
	padding: 0;
	width: 440px;
	list-style: none;
}

body#COURSE001 .tab_navi ul li {
	margin: 0;
	padding: 0;
	float: left;
}
*/
body#COURSE001 .course_campaign{
	margin: 0 0 15px 11px;
}

/*-----------------------------------------------------------*/
/*共通項目*/

body#COURSE001 #main_contents .left_calam{
	margin: 0;
	width: 100%;
}

a {
  color: #3795ff;
  text-decoration: none;
}

img {
  height: auto;
  /*vertical-align: bottom;*/
}

.txt_pink {
	color: #ff007f;
}

/*文字サイズ*/
.font_xx-small {font-size: xx-small; }
.font_x-small {font-size: x-small; }
.font_small {font-size: small; }
.font_medium {font-size: medium; }
.font_large{font-size: large; }
.font_x-large {font-size: x-large; }
.font_xx-large {font-size: xx-large; }

#course #main_contents .left_calam .btn {
	width: 95%;
	padding: 0.6rem 0;
	color: #5a5a5a;
	border-radius: 4px;
	display: inline-block;
	box-shadow: 0 3px 0 rgba(0, 0, 0, 0.2);
	text-align: center;
	font-weight: bold;
	border: 1px solid #aaaaaa;
	background-color: #fff;
	margin: 0 1%;
	font-size: 14px;
	text-shadow: none;
	text-decoration: none;
}

/*////////////////////////////////////////*/
.course_campaign {
	margin: 0 0 10px 0;
}
/*コース絞り込みボタン設定*/
#course #course_list .tab_navi {
	margin: 0;
	width: 100%;
	height: auto;
}

#course .btn a {
	color: #5a5a5a;
}
#course #course_list .tab_navi .btn_set {
	text-align: center;
}

#course #course_list .tab_navi .btn_set p {
	width: 120px;
	margin: 0 3px 15px;
	display:inline-block;
	line-height: 0.95em;
    /display:inline;
    /zoom:1

}

#course #course_list .tab_navi p a {
	font-size: 80%;
}

#course #course_list .tab_navi a:active {
	background: #f76c9b;
	color: #fff;
}
#course #course_list .tab_navi a.btn.active {
	background: #f76c9b;
	color: #fff;
}

#course #course_list .tab_navi p#tab_new_comic {
	position: relative;
}

#course #course_list .tab_navi p#tab_new_comic .icon_new {
	position: absolute;
	left: 0;
	top: 10px;
}

#course #course_list .tab_navi a:active .font_x-small,
#tab_new_comic a.btn.active .font_x-small {
	color: #fff;
}

#tab_new_comic .font_x-small {
	color: #ff0000;
}

/*ｈ2 見出し設定*/
#course .header_area {
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1, #ca1e57), color-stop(0.26, #d81f5d), color-stop(0, #f76c9b));
	background: -webkit-linear-gradient(top, #f76c9b 0%, #d81f5d 26%, #ca1e57 100%);
	background: -moz-linear-gradient(top, #f76c9b 0%, #d81f5d 26%, #ca1e57 100%);
	background: -o-linear-gradient(top, #f76c9b 0%, #d81f5d 26%, #ca1e57 100%);
	background: -ms-linear-gradient(top, #f76c9b 0%, #d81f5d 26%, #ca1e57 100%);
	background: linear-gradient(top, #f76c9b 0%, #d81f5d 26%, #ca1e57 100%);
}

#course .header_area h2 {
	text-align: left;
	/* margin: 0 auto 0px; */
	padding-left: 10px;
	max-width: 600px;
	/* font-size: 1.3rem; */
	font-size: 14px;
	color: #fff;
	text-shadow: 0 -2px 0 rgba(0, 0, 0, 0.4);
	position: relative;
	line-height: 40px;
	margin: 0 0 10px 0;
}
/*////////////////////////////////////////*/
/*各月額コース説明ブロック*/
#course .con_course {
	width: 100%;
	margin: 0 0 25px 0;
	padding: 0 0 5px 0;
	border-bottom: 1px dashed #ffaec9;
}
#COMIC002-2 .con_course {
    width: 97%;
    margin: auto;
    border-bottom: none;
}
#course .con_course .tit_wrap {
	border-radius: 8px;
	width: 100%;
	margin: 0 auto 10px auto;
	vertical-align: middle;
	position: relative;
	background: url("../img/course/bg_lace.png") top left no-repeat;
}

#course .con_course .tit_wrap .tit {
	margin: 0 auto;
	padding: 10px 0 10px 10px;
	width: 580px;
	text-align: center;
}

	#course .con_course .tit .box_txt {
		width: 65%;
		vertical-align: middle;
		display: inline-block;
		text-align: center;
}

	#course .con_course .tit .img_course {
		width: 30%;
		display:inline-block;
		/display:inline;
		/zoom:1;
		vertical-align:middle;
}

#course .con_course .tit h3 {
	width: 100%;
	margin: 0 auto 0.3em auto;
	font-size: 1.5em;
	background: none;
}

#course .con_course .tit .purchase_icon {
	position: absolute;
	top: 0;
	right: 0;
}

#course .con_course p.price {
	margin: 0;
	line-height: 1.2em;
}

#course .con_course .txt_desc {
	border-radius: 5px;
	margin: 10px auto 0 auto;
	padding: 3px 10px;
	width: 90%;
	background: #fff;
	text-align: center;
}

#course .con_course .txt_desc p.txt_pink {
	margin: 0;
	font-weight: bold;
	line-height: 1.2em;
}


	#COMIC002-2 #course .con_course .tit .img_course,
	#NOVEL002-2 #course .con_course .tit .img_course
	 {
			width: 120px;
	}

	#COMIC002-2 #course .con_course .tit,
	#NOVEL002-2 #course .con_course .tit {
		width: 100%;
		padding: 10px 0;
	}

	#COMIC002-2 #course .con_course .tit h3,
	#NOVEL002-2 #course .con_course .tit h3 {
		width: 80%;
	}

	#COMIC002-2 #course .con_course .txt_desc p.txt_pink,
	#NOVEL002-2 #course .con_course .txt_desc p.txt_pink {
		font-size: 90%;
	}

/*コース＿＿＿背景色定義*/
#course .con_course#course_41 .tit_wrap {background-color: #ffdfd2;}
#course .con_course#course_40 .tit_wrap {background-color: #defff2;}
#course .con_course#course_39 .tit_wrap {background-color: #ffd5d5;}
#course .con_course#course_38 .tit_wrap {background-color: #ffb7e3;}
#course .con_course#course_37 .tit_wrap {background-color: #efd5ff;}
#course .con_course#course_34 .tit_wrap {background-color: #ebe59d;}
#course .con_course#course_33 .tit_wrap {background-color: #e4edf8;}
#course .con_course#course_31 .tit_wrap {background-color: #f2d3b5;}
#course .con_course#course_30 .tit_wrap {background-color: #e5ebff;}
#course .con_course#course_25 .tit_wrap {background-color: #ffeedb;}
#course .con_course#course_24 .tit_wrap {background-color: #fffddc;}
#course .con_course#course_23 .tit_wrap {background-color: #d5fffd;}
#course .con_course#course_22 .tit_wrap {background-color: #ffdcdc;}
#course .con_course#course_21 .tit_wrap {background-color: #f0ffbd;}
#course .con_course#course_20 .tit_wrap {background-color: #ffd9fe;}
#course .con_course#course_19 .tit_wrap {background-color: #e9dbcc;}
#course .con_course#course_18 .tit_wrap {background-color: #ffdcfa;}
#course .con_course#course_17 .tit_wrap {background-color: #cffff2;}
#course .con_course#course_16 .tit_wrap {background-color: #ffb0e0;}
#course .con_course#course_15 .tit_wrap {background-color: #efd5ff;}
#course .con_course#course_14 .tit_wrap {background-color: #ffc3cb;}
#course .con_course#course_12 .tit_wrap {background-color: #d5f5ff;}
#course .con_course#course_11 .tit_wrap {background-color: #fffbbb;}
#course .con_course#course_10 .tit_wrap {background-color: #d5ffe1;}
#course .con_course#course_9 .tit_wrap {background-color: #deeeff;}
#course .con_course#course_8 .tit_wrap {background-color: #d5fffd;}
#course .con_course#course_7 .tit_wrap {background-color: #defff2;}/*201807終了*/
#course .con_course#course_6 .tit_wrap {background-color: #e8e5f8;}
#course .con_course#course_5 .tit_wrap {background-color: #ffe4c8;}
#course .con_course#course_4 .tit_wrap {background-color: #eed5ff;}
#course .con_course#course_3 .tit_wrap {background-color: #fffddc;}
#course .con_course#course_2 .tit_wrap {background-color: #ffeedb;}
#course .con_course#course_1 .tit_wrap {background-color: #e5ebff;}
/*Y!系コースは全部同じ*/
#course .con_course#course_101 .tit_wrap,
#course .con_course#course_102 .tit_wrap,
#course .con_course#course_103 .tit_wrap,
#course .con_course#course_104 .tit_wrap,
#course .con_course#course_105 .tit_wrap,
#course .con_course#course_106 .tit_wrap,
#course .con_course#course_107 .tit_wrap,
#course .con_course#course_108 .tit_wrap,
#course .con_course#course_109 .tit_wrap,
#course .con_course#course_110 .tit_wrap,
#course .con_course#course_111 .tit_wrap,
#course .con_course#course_112 .tit_wrap,
#course .con_course#course_113 .tit_wrap,
#course .con_course#course_114 .tit_wrap,
#course .con_course#course_115 .tit_wrap,
#course .con_course#course_116 .tit_wrap,
#course .con_course#course_117 .tit_wrap,
#course .con_course#course_118 .tit_wrap,
#course .con_course#course_109 .tit_wrap
 {background-color: #ffe0e0;}



/*////////////////////////////////////////*/
.font_small.txt_pink {
	margin: 5px auto;
	width: 95%;
	padding: 2px 0;
	text-align: center;
	background-color: #fffb93;
	font-size: 110%;
	font-weight: bold;
}

#course .con_course .txt_memo {
	margin: 0 auto;
	width: 95%;
	text-align: left;
}

/*コース＿＿＿table*/
#course .con_course table {
	width: 95%;
	margin-right: auto;
	margin-left: auto;
	border-top: 1px #bebebe solid;
	border-left: 1px #bebebe solid;
	border-right: 1px #bebebe solid;
}

#course .con_course table th{
	width: 65%;
	padding: 5px;
	background: #f0f0f0;
	background-image: none;
	border-right: 1px #bebebe solid;
	border-bottom: 1px #bebebe solid;
}

#course .con_course table td {
	padding: 5px;
	background: #fff;
	background-image: none;
	text-align: center;
	border-bottom: 1px #bebebe solid;
}

#course .con_course table tr.font-large {
	font-size: 140%;
}
#course .con_course .btn_set {
	padding: 0 0 15px ;
	text-align: center;
}

#course .btn_set li {
	list-style-type: none;
	display: inline-block;
	width: 45% !important;
}
#course .btn_set.btn_3col p {
	list-style-type: none;
	display: inline-block;
	width: 31% !important;
	letter-spacing: -0.05em;
}

/*コース＿＿＿btn*/

a.btn_color2 {
	border: 1px solid #68b208;
	color: #fff;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1, #7bcf0c), color-stop(0, #9bdb47));
	background: -webkit-linear-gradient(top, #9bdb47 0%, #7bcf0c 100%);
	background: -moz-linear-gradient(top, #9bdb47 0%, #7bcf0c 100%);
	background: -o-linear-gradient(top, #9bdb47 0%, #7bcf0c 100%);
	background: -ms-linear-gradient(top, #9bdb47 0%, #7bcf0c 100%);
	background: linear-gradient(top, #9bdb47 0%, #7bcf0c 100%);
}


a.btn_color4 {
	border: 1px solid #5a5a5a;
	color: #5a5a5a;
	text-shadow: 0 -1px 0 rgba(255, 255, 255, 1);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1, #dadada), color-stop(0, #f0f0f0));
	background: -webkit-linear-gradient(top, #f0f0f0 0%, #dadada 100%);
	background: -moz-linear-gradient(top, #f0f0f0 0%, #dadada 100%);
	background: -o-linear-gradient(top, #f0f0f0 0%, #dadada 100%);
	background: -ms-linear-gradient(top, #f0f0f0 0%, #dadada 100%);
	background: linear-gradient(top, #f0f0f0 0%, #dadada 100%);
}

#course .con_course .btn_hl {
	width: 100%;
	margin: 5px auto;
	border-radius: 4px;
	display: inline-block;
	box-shadow: 0 3px 0 rgba(0, 0, 0, 0.2);
	text-align: center;
	font-weight: bold;
	border: 1px solid #aaaaaa;
	background-color: #e3e3e3;
	padding: 0.6rem 0;
	font-size: 14px;
	text-decoration: none;
}

.btn_hl{
	    font-size: 1rem; } }
@media screen and (max-width: 360px) {
  html {
    font-size: 11px; }
}

/*コース＿＿＿おすすめPick UP*/
/* book 1col */

.book_area_1 {
  margin: auto;
  font-size: 0; }
  .book_area_1 .book_unit {
    margin: 0;
    padding: 0 1% 10px;
    width: 100%;
    display: inline-block;
    font-size: 1rem;
    vertical-align: top;
    box-sizing: border-box; }
    .book_area_1 .book_unit .book_img {
	  width: 20%;
	  margin-left: 2%;
	  display: inline-block;
	  text-align: right; }
	    .book_area_1 .book_unit .book_img img {
	    width: 100%;
		box-shadow:0px 0px 3px 2px rgba(0,0,0,0.2);
		-moz-box-shadow:0px 0px 3px 2px rgba(0,0,0,0.2);
		-webkit-box-shadow:0px 0px 3px 2px rgba(0,0,0,0.2);}

    .book_area_1 .book_unit .book_detail {
      margin-left: 2%;
      width: 70%;
      display: inline-block;
      vertical-align: top; }
      .book_area_1 .book_unit p {
        margin: 0 7px 0 0; }
        .book_area_1 .book_unit .book_detail .book_title {
        margin: 0;
        }
      .book_area_1 .book_unit .book_detail .book_title a {
        color: #c91e57;
         }
      .book_area_1 .book_unit .book_detail .book_author a {
        font-size: 0.8rem; }
        .book_area_1 .book_unit .book_detail .btn_area {
        width: 30%;
    	margin: 10px 0 0 0;}
      .book_area_1 .book_unit .book_detail .btn_area .btn {
        margin-top: 5px;
        width: 45%; }

#course .book_area_1 {
	margin: 15px auto;
	padding-top: 10px;
	width: 95%;
	border: 1px dotted #f76c9b;
	background: #ffedf3;
}

.book_unit {
    margin: 0;
    padding: 0 1% 10px;
    width: 100%;
    font-size: 1rem;
    display: inline-block;
    vertical-align: top;
    box-sizing: border-box;}

	.book_unit .book_detail {
	margin-left: 2%;
	width: 58%;
	display: inline-block;
	vertical-align: top;
 	text-align: left;
	 }
		.book_unit .book_detail .book_img {
			width: 34%;
			margin-left: 2%;
			display: inline-block;
			text-align: right;
		}

		.book_unit .book_detail h4 {
		 	background: #f76c9b;
		 	margin: 0 0 5px 0;
		 	padding: 3px;
		 	color: #fff;
		 	font-size: 0.9em;
		 }

		.book_unit .book_detail a{
			font-size: 0.9rem;
		}

/*コース＿＿＿詳細ページ制御*/
#COMIC002-2 .naviTitle {
	margin: 0 0 20px 0;
	padding-right: 5px;
	letter-spacing: -0.05em;
}

#COMIC002-2 .naviTitle .btn{
	font-size: 0.85em;
	width: 65px;
	padding: 5px 0;
}

#COMIC002-2.course_paginatour {
	margin: -20px 0 0 0;
}

#COMIC002-2 .btn_area {
	margin: 3px 0 0 0;
}

#COMIC002-2 .bookarea .btn {
	width: 95%;
	margin: 0 auto;
	padding: 0.3rem 0;
	color: #ff9600;
	border-radius: 4px;
	display: inline-block;
	box-shadow: 0 3px 0 rgba(0, 0, 0, 0.2);
	text-align: center;
	font-weight: bold;
	border: 1px solid #aaaaaa;
	background-color: #fff;
	font-size: 14px;
	text-shadow: none;
	text-decoration: none;
}

#COMIC002-2 .bookarea .new_book {
	width: 78px;
	margin: 4px auto 0;
	padding: 2px;
	color: #fff;
	background: #ff47c0;
	border-radius: 3px;
	font-weight: bold;
}

#COMIC002-2 .bookarea .btn:hover {
	background-color: #e8e8e8;
}

.review {
	margin: 5px 0 0 0;
}

.ico_heart {
    position: relative;
	top: 3px;
	left: 7px;
    width: 10px;
    height: 9px;
    margin: 0;
    padding: 0;
}
.ico_heart:before,
.ico_heart:after {
    position: absolute;
    content: "";
    left: 5px;
    top: 2px;
    width: 5px;
    height: 8px;
    background: rgb(255, 71, 192);
    -moz-border-radius: 50px 50px 0 0;
    border-radius: 50px 50px 0 0;
    -webkit-transform: rotate(-45deg);
       -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
         -o-transform: rotate(-45deg);
            transform: rotate(-45deg);
    -webkit-transform-origin: 0 100%;
       -moz-transform-origin: 0 100%;
        -ms-transform-origin: 0 100%;
         -o-transform-origin: 0 100%;
            transform-origin: 0 100%;
}
.ico_heart:after {
    left: 0;
    -webkit-transform: rotate(45deg);
       -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
         -o-transform: rotate(45deg);
            transform: rotate(45deg);
    -webkit-transform-origin: 100% 100%;
       -moz-transform-origin: 100% 100%;
        -ms-transform-origin: 100% 100%;
         -o-transform-origin: 100% 100%;
            transform-origin :100% 100%;
}

.course_eva_num {
	margin: 0;
	padding: 0 0 0 10px;
	position: relative;
	top: -10px;
}