﻿@charset "utf-8";


/*
	サイトで使用するCSS
*/


/* ナビ _____________________________________________________________________ */
#nav {
	background:url('../img/nav_bg.png') repeat-x;
	width:100%;
	height:100px;
	margin-top:-7px;
	min-width:1200px;
}

#nav ul {
	width:1200px;
	margin:auto;
}

#nav ul li {
	margin-top:15px;
	float:left;
/*	border-right:1px solid #399BB8;*/
	width:25%;
	box-sizing:border-box;
	text-align:center;
}

#nav ul li:last-child {
	border-right:none;
}

.img_line { margin-left: 32px;}

/* __________________________________________________________________________ */


/* 魚津市ってどんなところ？ _________________________________________________ */
#what {
	background:url('../img/top/first_bg.jpg') no-repeat center;
	height:986px;
	min-width:1200px;
}

#what .inner {
	position:relative;
}

#what .box {
	position:absolute;
	top:320px;
	left:0;
	width:60%;
}

#what h1 {
	margin-left:20px;
}

#what p {
	margin-top:20px;
	background:#fff;
	padding:20px;
	border-radius: 20px; 
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px; 
	font-size:16px;
	line-height:180%;
}
/* __________________________________________________________________________ */


/* うおづ4姉妹 ______________________________________________________________ */
#sister .inner {
	position:relative;
}

#sister h2 {
	position:absolute;
	top:0;
	right:-40px;
}


#sister li .face {
	display:table-cell;
	vertical-align:middle;
}

#sister li .data {
	display:table-cell;
	vertical-align:middle;
	padding-left:20px;
}

#sister li .data p {
	margin-top:10px;
}
/* __________________________________________________________________________ */


/* CMギャラリー _____________________________________________________________ */
#cm {
	margin-top:100px;
}

#cm .inner {
	position:relative;
}

#cm h2 {
	position:absolute;
	top:0px;
	left:-200px;
}

#cm .cm_list {
	margin-left:220px;
}

#cm .cm_list .image {
	float:left;
	position:relative;
	background:url('../img/top/cm_img_bg.png') no-repeat;
	height:270px;
	width:370px;
}

#cm .cm_list .image .cmimg {
	position:absolute;
	top:33px;
	left:7px;
}

#cm .cm_list .image .click {
	position:absolute;
	right:0;
	bottom:0;
	z-index:9;
}

#cm .cm_list .image .movie {
	position:absolute;
	left:0;
	top:0;
}

#cm .cm_list .data {
	float:right;
	width:410px;
}

#cm .cm_list .data h3 {
	font-size:30px;
	font-weight:bold;
	margin-top:20px;
}

#cm .cm_list .data p {
	width:435px;
	height:175px;
	padding-top:20px;
	padding-left:20px;
	margin-top:10px;
}

#cm .cm_list .data p.s01 {
	background:url('../img/top/cm_ex01.png') no-repeat;
}

#cm .cm_list .data p.s02 {
	background:url('../img/top/cm_ex02.png') no-repeat;
}

#cm .cm_list .data p.s03 {
	background:url('../img/top/cm_ex03.png') no-repeat;
}

#cm .cm_list .data p.s04 {
	background:url('../img/top/cm_ex04.png') no-repeat;
}


#cm .cm_list li {
	margin-bottom:20px;
}

/* __________________________________________________________________________ */


/* 特別番組 _____________________________________________________________ */
#special {
	margin-top:100px;
	background:url('../img/top/special_bg.png') no-repeat;
	background-position: center;
	background-size:cover;
	padding-bottom:160px;
	min-width:1200px;
}

#special .inner {
	position:relative;
}

#special .inner h1 {
	margin-left:50px;
}

#special .chara {
	position:absolute;
	bottom:-100px;
	right:-40px;
}

#special .chara p {
	font-size:12px;
	padding-left:190px;
	line-height:150%;
	text-align:center;
}

#special h2 {
	position:absolute;
	top:0;
	right:-40px;
}

#special .special_content {
	margin-left:50px;
}

#special .movie {
	margin-top:20px;
/*	width:796px;
	height:446px;
*/
}


#special p.place {
	margin:20px 0px;
}

#special h3 {
	font-size:14px;
}

#special table {
	margin-top:20px;
	font-size:14px;
	float:left;
	width:40%;
}

#special .return {
	position:absolute;
	bottom:-150px;
	right:-140px;
}
/* __________________________________________________________________________ */

/* footer ___________________________________________________________________ */
#footer .copy {
	text-align:center;
	padding:10px;
}
/* __________________________________________________________________________ */



#page-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
}
#page-top a {
    width: 65px;
    padding: 30px 0;
    text-align: center;
    display: block;
}

