@charset "utf-8";
/*--------------------------------------------------------

	common

	01. forPC Layout

	02. forSP Layout

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




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

	01. forPC Layout

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

.col-12 {width: 100%;}

.col-6 {width: 50%; float: left;}

.box-bg {
  overflow: hidden;
	margin:0 0 40px;
	padding: 12px 18px 18px;
}

.hr_gray {
    display: block;
    margin: 0 0;
    border: none;
    background: #fff;
}
.hr_gray:before{
    content: "";
    display: block;
    border-top: 2px solid #dfdfdf;
}

/* ------------------ .link_block ------------------ */

.link_block{
  display: block;
  text-decoration: none !important;
}

/* ------------------ .imghover ------------------ */
.no_link{
  cursor: default !important;
  text-decoration: none !important;
}

/* ------------------ .imghover ------------------ */

.imghover{
  text-decoration: none !important;
  transition: opacity 0.4s ease 0s;
    -webkit-transition: opacity 0.4s ease 0s;
    -moz-transition: opacity 0.4s ease 0s;
    -o-transition: opacity 0.4s ease 0s;
    -ms-transition: opacity 0.4s ease 0s ;
}

.imghover02.no_link{
  -ms-filter: "alpha(opacity=100)" !important;
    -khtml-opacity: 1 !important;
    filter: alpha(opacity=100) !important;
    -moz-opacity: 1 !important;
    opacity: 1 !important;
}

/*.normal .imghover:hover,*/
.imghover:hover,
.imghover.active{
 -ms-filter: "alpha(opacity=70)" ;
    -khtml-opacity: 0.7;
    filter: alpha(opacity=70);
    -moz-opacity: 0.7;
    opacity: 0.7;   
}

.imghover02{
  text-decoration: none !important;
  transition: opacity 0.4s ease 0s;
    -webkit-transition: opacity 0.4s ease 0s;
    -moz-transition: opacity 0.4s ease 0s;
    -o-transition: opacity 0.4s ease 0s;
    -ms-transition: opacity 0.4s ease 0s;
}

.imghover02{
  -ms-filter: "alpha(opacity=50)" ;
    -khtml-opacity: 0.5;
    filter: alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;   
}

.imghover02.no_link{
  -ms-filter: "alpha(opacity=50)" !important;
    -khtml-opacity: 0.5 !important;
    filter: alpha(opacity=50) !important;
    -moz-opacity: 0.5 !important;
    opacity: 0.5 !important;    
}

.normal .imghover02:hover{
  -ms-filter: "alpha(opacity=100)" ;
    -khtml-opacity: 1;
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
}

.imghover02.active{
  -ms-filter: "alpha(opacity=100)" ;
    -khtml-opacity: 1;
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
}

.normal .imghover02.active:hover{
  -ms-filter: "alpha(opacity=50)" ;
    -khtml-opacity: 0.5;
    filter: alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;   
}

/* ------------------ .icon_new ------------------ */

.icon_new {
    position: absolute;
    left: 0;
/*    top: 6px;*/
    top: 4px;
    z-index: 5;
    padding: 3px 4px 1px;
    background: #ff0000;
    color: #ffffff;
    font-size: 14px;
    line-height: 1;
    text-align: center;
}
@media all and (-ms-high-contrast:none){
  *::-ms-backdrop, 
.icon_new {
    padding: 4px 4px 0;
}  /* IE11 */
}

.icon_new_right {
    left: auto;
    right: -10px;
    top: -5px;
}

.download_panel_main .icon_new {
    position: absolute;
    left: 50px;
    top: 8px;
}


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

	02. forSP Layout
    *横幅が667px以下の場合


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

@media screen and (min-width: 0px) and (max-width: 668px) {


.col-6 {width: 100%; float: none;}

/* ------------------ .icon_new ------------------ */

.icon_new {
    top: 2px;
    padding: 2px 4px 1px;
    font-size: 12px;
}

.icon_new_right {
    right: -6px;
    top: -12px;
}

.download_panel_main .icon_new {
    position: absolute;
    left: 35px;
    top: 3px;
}


}