/* --------------------------------------------------

	海外競馬発売共通

-------------------------------------------------- */

.body_wrapper {
	width: 940px;
	margin: 30px auto 0 auto;
}

.body_wrapper .left_col {
	width: 210px;
	float: left;
}

.body_wrapper .right_col {
	width: 700px;
	float: right;
}

/*.body_wrapper .contents_header {
	border-top: 4px solid #2891cf;
}*/

a:hover {
	color: #1faa37;
	text-decoration: none; 
}

.img img { vertical-align: top; }

.block_unit > h3 {
	background-color: #0069a7;
}

.block_unit > h3 > span {
	margin-left:12px;	
}

ul.block_list.type1 > li {
	margin-top:30px;
}



/* - メニュー開閉ボタン
-------------------------------------------------- */
.btn_menu { display: none; }

.btn_menu > ul.link_list { padding: 0; }

.btn_menu > ul.link_list > li > a > .inner > .icon > .open {}
.btn_menu.on > ul.link_list > li > a > .inner > .icon > .open { display: none; }

.btn_menu > ul.link_list > li > a > .inner > .icon > .close { display: none; }
.btn_menu.on > ul.link_list > li > a > .inner > .icon > .close { display: inline; }

.btn_menu > ul.link_list > li > a > .inner > .txt > .open {}
.btn_menu.on > ul.link_list > li > a > .inner > .txt > .open { display: none; }

.btn_menu > ul.link_list > li > a > .inner > .txt > .close { display: none; }
.btn_menu.on > ul.link_list > li > a > .inner > .txt > .close { display: inline; }






/* - 左カラムメニュー
-------------------------------------------------- */

dl.menu_list { width: 210px; }

dl.menu_list > dt {
    background-color: #4e4e4e;
    border-bottom: 1px solid;
    color: #fff;
    font-size: 1.4rem;
}

dl.menu_list > dt > a {
    display: block;
    text-decoration: none;
    color: #fff;
    font-weight: bold;
    font-size: 1.4rem;
    padding: 8px 4px;
    text-align: center;
}

dl.menu_list > dt > a > ul.flag {
   
}

dl.menu_list > dt > a > ul.flag > li {
	display:inline-block;
	vertical-align:middle;
	line-height:0;
}

dl.menu_list > dt > a > ul.flag > li:first-child {
	padding-right:0.2rem;
}

dl.menu_list > dt > a > ul.flag > li img {
	width:24px;
	line-height:0;
}

dl.menu_list > dd {
	background-color: #ebebeb;
	padding: 10px;
}


dl.menu_list > dd > ul {
	/*display: none;*/
}

/*
dl.menu_list > dd.on > ul {
    display: block;
    opacity: 1;
    animation: obj_fade_in 0.5s ease-in-out;
}

@keyframes obj_fade_in {
    from{ opacity: 0; }
    to{ opacity: 1; }
}
*/


dl.menu_list > dd > ul > li {
	width: 190px;
	/*height: 60px;*/
	margin: 5px auto 0 auto;
}

dl.menu_list > dd > ul > li:first-child {
	margin-top: 0;
}


dl.menu_list > dd > ul > li > a {
	color:#444;
	text-decoration:none;
	padding:8px;
	display: block;
	text-align: left;
	width:190px;
	background-color:#FFF;
	border-radius: 4px;
	box-shadow: 0 1px 4px 0 rgba(0,0,0,0.1);
	box-sizing:border-box;
	letter-spacing:-0.05em;
}

dl.menu_list > dd > ul > li.current > a {
	background-color:#fff8e1;
}

dl.menu_list > dd > ul > li > a:hover {
	background-color:#fff8e1;

}

dl.menu_list > dd > ul > li > a > .inner {
	display:table;
  width: 100%;
}

dl.menu_list > dd > ul > li > a > .inner > span.icon {
	display:table-cell;
	padding-right:8px;
	box-sizing:border-box;
	vertical-align:top;
	line-height:0;
  width: 48px;
}

dl.menu_list > dd > ul > li > a > .inner > span.icon img {
	max-width:40px;
	line-height:0;
}

dl.menu_list > dd > ul > li > a > .inner > p {
	display:table-cell;
	vertical-align:middle;
	font-weight:bold;
	font-size:1.4rem;
}

dl.menu_list > dd > ul > li > a > .inner > p > span {
	display:block;
}


dl.menu_list > dd > ul > li > a:hover { }

dl.menu_list > dd > ul > li.current > a {  }


/* - ヘッダー部分
-------------------------------------------------- */

/*
.head {
	background-color: #7b877b;
	color: #fff;
	background-color: #333;
	
	 background-color: #33691E;
	 background-color: #1B5E20;
	 background-color: #18531c;
	 background-color:#0069a7;
	margin: 0;
	width: 100%;
}

/*.head > .content {
	max-width: 940px;
	margin: 0 auto;
	box-sizing: border-box;
	
	overflow: hidden;
}

.head > .content:after { content: ''; display: block; clear: both; }

*/

/*
.head > .content .title {
	padding: 10px 0;
}

.head > .content .title > h2 {
	font-size: 1.2rem;
}

.head > .content .title > h3 {
	font-size: 2.1rem;
	line-height: 1.4;
	font-weight: bold;
}

.head > .content > .title > p {
	font-size: 93%;
	margin-top: 10px;
}
*/

/*.head > .content .title { padding: 10px 0; }

.head > .content .title > p { font-size: 1.2rem; }

.head > .content .title > h2 {
	font-size: 2.1rem;
	line-height: 1.4;
	font-weight: bold;
}


.head img {
	vertical-align: top;
}


.head > .content > .img {
	max-width: 300px;
	float: right;
}*/


/* - アンカーボタン
-------------------------------------------------- */


.anch_block {
    background-color: #ebebeb;
    padding: 5px;
    max-width: 700px;
    width: 100%;
	margin-bottom:30px;
}

.anch_block ul {
    width: 100%;
	overflow:hidden;
}

.anch_block ul:after {
    content: '';
	display: block;
	clear: both;
}

.anch_block ul li {
	float:left;
    padding: 5px;
    box-sizing: border-box;
    text-align: center;
}

.anch_block ul.btn_2 li {
	width:50%;
}

.anch_block ul.btn_3 li {
	width:33.33%;
}

.anch_block ul.btn_4 li {
	width:25%;
}

.anch_block ul li a {
    display: block;
    padding: 10px;
    background-color: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    border-radius: 4px;
    font-size: 1.6rem;
    font-weight: bold;
    color: #444;
    text-decoration: none;
}

.anch_block ul li a:hover { background-color: #f1f8e9; }


.anch_block ul li a .inner {
	display:table;
	margin:0 auto;
}

.anch_block ul li a .inner > span.icon {
	display:table-cell;
	vertical-align:middle;
	padding-right:0.8rem;
	font-size:1.8rem;
}

.anch_block ul li a .inner > p {
	display:table-cell;
	vertical-align:middle;
}

.anch_block ul li a .inner > p > span {
	display:block;
	font-size:1.3rem;
}

.anch_block ul li a i {
    margin-right: 0.5rem;
    color: #188542;
}




/* ----- アニメーション ----- */
@keyframes obj_fade_in {
    from{ opacity: 0; }
    to{ opacity: 1; }
}


/* ------------------------------------------------------------

	959px以下

------------------------------------------------------------ */
@media screen and ( max-width : 959px ) {


	.body_wrapper .left_col {
		float: none;
		width: 100%;
		max-width: 720px;
		margin: 0 auto 30px;
	}
	
	
	.body_wrapper .right_col { float: none; margin: 0 auto; width:720px; }
	
    
    
    
    .btn_menu { display: block; }
    
    dl.menu_list > dd > ul { display: none; }

    dl.menu_list > dd.on > ul {
        display: block;
        opacity: 1;
        animation: obj_fade_in 0.5s ease-in-out;
    }
    
    
	
	/* - 左カラムメニュー
	---------------------------------------- */
	.body_wrapper .left_col dl.menu_list {
		width: 100%;
	}
	
	dl.menu_list > dd {
		padding: 4px;
	}
	
	dl.menu_list > dd > ul {
		overflow: hidden;
		/zoom : 1;
	}
	
	dl.menu_list > dd > ul:after {
		content: '';
		display: block;
		clear: both;
	}
	
	dl.menu_list > dd > ul > li {
		margin: 0;
		float: left;
		width: 50%;
		padding:4px;
	}
  
  dl.menu_list > dd > ul > li.wide {
		width: 100%;
	}
  
  
	
	dl.menu_list > dd > ul > li:first-child {
		/*margin-top: 0;*/
	}


	dl.menu_list > dd > ul > li:first-child {
	/*margin-top: 5px;*/
	}

	dl.menu_list > dd > ul > li > a {
	width:100%;
	}
  
  dl.menu_list > dd > ul > li > a > .inner > span.icon {
    width: 50px;
}
  
  
	dl.menu_list > dd > ul > li > a > .inner > span.icon img {
	  max-width:42px;
  }

dl.menu_list > dd > ul > li > a > .inner > p > span {
	display:inline;
}


dl.menu_list > dd > ul > li > a > .inner > p > span.intro {
	/*display:block;*/
}

}


/* ------------------------------------------------------------

	767px以下

------------------------------------------------------------ */
@media screen and ( max-width : 767px ) {

	.body_wrapper .right_col {
    	width: auto;
	}
	
	/* - 左カラムメニュー
	---------------------------------------- */
	dl.menu_list > dd { padding: 5px; }
	
	dl.menu_list > dd > ul {
		margin: 0;
		overflow: hidden;
		/zoom : 1;
	}
	
	dl.menu_list > dd > ul:after {
		content: '';
		display: block;
		clear: both;
	}
	
	dl.menu_list > dd > ul > li {
		float: left;
		margin:0;
		box-sizing: border-box;
		width: 50%;
		padding: 4px;
		height: 68px;
	}
	
	dl.menu_list > dd > ul > li > a,
	dl.menu_list > dd > ul > li > span { width: auto; }
	dl.menu_list > dd > ul > li:first-child { margin: 0; }
	
	
	.head > .content .title {
		/* float: left; */
		/* width: 600px; */
		/* margin-top: 20px; */
		padding: 10px;
	}
	
	
	.select_block {
		text-align: left;
	}

}

@media screen and ( max-width : 690px ) {
    
    dl.menu_list > dd > ul > li > a > .inner > p > span.intro {
        display:block;
    }
    
    .anch_block ul.btn_4 li {
        width:50%;
    }
    
}


/* ------------------------------------------------------------

	639px以下

------------------------------------------------------------ */
@media screen and ( max-width : 639px ) {
    
    .select_block {	text-align: left; }
    
    .select_block > ul > li > .content > a {
        font-size: 1.8rem;
        padding-left: 2.8rem;
    }
    
    .select_block > ul > li > .content > a span { font-size: 1.4rem; }
    
    .select_block > ul > li div.content a i {
        text-indent: -1.8rem;
        margin-right: 0.2rem;
    }
    
    p.sp_line {
        display: block;
        margin-bottom: 4px;
    }
    
}


@media screen and ( max-width : 479px ) {
    
    .block_unit > h3 > span {
        display:block;
        margin-top:2px;
        margin-left:0;
        
    }
    
    dl.menu_list > dd > ul > li {
        width: 100%;
        float:none;
    }
    
    .anch_block ul.btn_3 li {
        width:100%;
        float:none;
    }
    
    
    .btn_menu > ul.link_list.center > li > a > .inner {
        margin: 0 auto;
    }

}