/* CSS Document */
/*
reset CSS
*/
html {
	margin: 0px!important;
	}

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
	font-size: 14px;
	line-height: 1.4;
}

body {
    line-height:1;
	max-width: 1920px;
	overflow-x: hidden;
}

article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary {
	display:block;
}

ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

img {
  vertical-align: bottom;
}
 
img {
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    border:0;
    font-size:100%;
	color: #006659;
}
a:hover {
	}

ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

mark {
    background-color:#ff9;
    color:#000;
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted #000;
    cursor:help;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}

hr {
    display:block;
    height:1px;
    border:0;
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}

/* For modern browsers */
.clearfix:before,
.clearfix:after {
    content:"";
    display:table;
}
 
.clearfix:after {
    clear:both;
}
 
/* For IE 6/7 (trigger hasLayout) */
.clearfix {
    zoom:1;
}


.left {
	float: left;
	}
.right {
	float: right;
	}


/**
 * 8.0 - Alignments
 */

.alignleft {
	float: left;
	margin: 0.375em 1.75em 1.75em 0;
}

.alignright {
	float: right;
	margin: 0.375em 0 1.75em 1.75em;
}

.aligncenter {
	clear: both;
	display: block;
	margin: 0 auto 1.75em;
}

blockquote.alignleft {
	margin: 0.3157894737em 1.4736842105em 1.473684211em 0;
}

blockquote.alignright {
	margin: 0.3157894737em 0 1.473684211em 1.4736842105em;
}

blockquote.aligncenter {
	margin-bottom: 1.473684211em;
}


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

 ナビゲーション固定

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

nav {
  transition: .3s;
}
.is-fixed {
  position: fixed;
  top: -15px;
  z-index: 2;
  width: 100%;
  background-color: #FFFFFF;
}
.is-fixed div.nav_bc {
	width: 1000px;
	margin: 0 auto;
	}
.is-hide {
  transform: translateY(-100%);
}



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

 COMMON

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



.left {
	float:left;
	}
.right {
	float: right;
	}

div#main {
	background: url(../../img/top_bg.png) no-repeat;
	width: 100%;
	}
header {
	width: 1000px;
	margin: 0 auto;
	position: relative;
	}
h1 {
	width: 360px;
    height: 64px;
    text-align: center;
    margin: 0 auto;
    padding-top: 80px;
	}
h2 {
    text-align: center;
    margin: 0 auto;
	margin-bottom: 40px;
	}
h3 {
    text-align: center;
    margin: 0 auto;
	margin-bottom: 35px;
	}
p {
	font-size: 16px;
	text-align: center;
	line-height: 1.6;
	}

div#header_conpany {
	float: right;
	position: absolute;
	top: 0px;
	right: 0px;
	}

/*/////// ナビゲーション //////////*/
nav {
	margin: 0 auto;
	margin-top: 15px;
	padding-top: 10px;
	padding-bottom: 10px;
	background-color: #FFFFFF;
	}
nav div.nav_bc {
	width: 1000px;
	margin: 0 auto;
	}
nav ul li a {
	text-indent: -9999px;
	height: 65px;
	float:left;
	}
li.nav_about a { background:url(../../img/sakusyu_nav1.png) no-repeat; width: 239px;}
li.nav_fishing a { background:url(../../img/sakusyu_nav2.png) no-repeat; width: 159px;}
li.nav_kanroni a { background:url(../../img/sakusyu_nav3.png) no-repeat; width: 159px;}
li.nav_enjoy a { background:url(../../img/sakusyu_nav4.png) no-repeat; width: 264px;}
li.nav_access a { background:url(../../img/sakusyu_nav5.png) no-repeat; width: 179px;}

li.nav_about a:hover { background:url(../../img/sakusyu_nav1_on.png) no-repeat; }
li.nav_fishing a:hover { background:url(../../img/sakusyu_nav2_on.png) no-repeat; }
li.nav_kanroni a:hover { background:url(../../img/sakusyu_nav3_on.png) no-repeat; }
li.nav_enjoy a:hover { background:url(../../img/sakusyu_nav4_on.png) no-repeat; }
li.nav_access a:hover { background:url(../../img/sakusyu_nav5_on.png) no-repeat; }

/*/////// メインセクション //////////*/
main {
	margin-top: 30px;
	}
div#mainimage {
	background:url(../../img/mainimage.jpg) ;
	background-size: cover;
	height: 625px;
	}
div#mainimage div#overimage {
	width: 1000px;
	margin: 0 auto;
	text-align: center;
	}
div#slide_wrap {
	position: relative;
	}
div.infiniteslide {
	height: 226px;
	position: absolute;
	top: -125px;
	}
div.infiniteslide li {
	margin-right: 85px;
	float: left;
	}


/*/////// 作州水産の魅力セクション //////////*/
div#about {
	padding-top: 180px;
	}
div#about section {
	width: 1000px;
	margin: 0 auto;
	}
div#about_pic {
	
	}
div#about p {
	width: 800px;
	margin: 0 auto;
	margin-bottom: 30px;
	}
div#about .youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  margin-top: 40px;
}
div#about .youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}

/*/////// 釣り堀セクション //////////*/
div#fishing {
	background: #399E42;
	margin-top: 150px;
	padding-top: 100px;
	padding-bottom: 90px;
	}
div#fishing  section {
	width: 1000px;
	margin: 0 auto;;	
	}
div#fishing  section p {
	color: #FFFFFF;
	}
div#Fishing_image {
	margin-top: 40px;
	}
div.fishing_pic {
	margin-right: 7px;
	}
div.fishing_pic2 {
	margin-right: 0px;
	}
	
/*/////// 甘露煮セクション //////////*/
div#kanroni {
	margin-top: 40px;
	padding-top: 90px;
	padding-bottom: 90px;
	}	
div#kanroni section {
	width: 1000px;
	margin: 0 auto;	
	}
div#kanroni_image {
	width: 650px;
	margin: 0 auto;	
	}
div#kanroni_image p {
	width: 400px;
	margin-top: 25px;
	line-height: 2;
	}

/*/////// スポットセクション //////////*/
div#enjoy {
	background: #399E42;
	margin-top: 50px;
	padding-top: 100px;
	padding-bottom: 90px;
	}
div#enjoy  section {
	width: 1000px;
	margin: 0 auto;	
	}
div#enjoy img {
	display: inherit;
	text-align: center;
	margin: 0 auto;
	}
div#enjoy p {
	margin-top: 10px;
	}
div#enjoy_cb {
	background-color: #FFFFFF;
	padding: 90px;
	padding-top: 80px;
	}
div#enjoy h3 {
	font-size: 26px;
	margin-bottom: 30px;
	color: #379D3F;
	}
div#enjoy_image div.enjoy_box {
	width: 246px;
	margin-right: 41px;
	}
div#enjoy div#enjoy_image {
	margin-top: 50px;
	}
div#enjoy div#enjoy_image h3 {
	margin-bottom: 0px;
	}
div#enjoy_image div.enjoy_box2 {
	width: 246px;
	margin-right: 0px;
	}
div#bunner {
	margin-top: 35px;
	text-align:center;
	}
div#bunner a:hover {
	opacity: 0.7;
	}
div#enjoy .youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  margin-top: 40px;
}
div#enjoy .youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}

/*/////// アクセスセクション //////////*/
div#access {
	margin-top: 100px;
	}
div#acces p#address {
	margin-top: 30px!important;
	}
div#access_box {
	margin-top: 30px;
	}
	
footer {
	margin-top: 60px;
	background: url(../../img/footer_bg.png) repeat-x;
	background-color: #379D40;
	height: 200px;	
	}
div#footer_box {
	width: 1000px;
	margin: 0 auto;
	padding-top: 140px;	
	}
div#copyright {
	clear: both;
	margin-bottom: 5px;
	text-align:center;
	color: #FFFFFF;
	}
div#copyright p {
	font-size: 12px;
	}
	
div#ryokin {
	margin-top: 25px;
	padding: 30px;
	background-color: #FFFFFF;
	}
div#ryokin h3 {
	font-size: 20px;
	color:  #379D40;
	font-weight: bold;
	margin-bottom: 5px;
	padding-bottom: 5px;
	border-bottom: 1px solid #379D40;
	}
div#fishing  section div#ryokin p.strong {
	color:  #000000;
	font-weight:bold;
	margin-top: 20px;
	}
div#fishing  section div#ryokin p {
	color:  #000000;
	}
div#fishing  section div#ryokin span {
	text-align: center;
	display:block;
	margin-top: 25px;
	}

div#repair {
	margin: 0 auto;
	width: 1000px;
	margin: 60px auto;
	}
div#repair h2 {
	margin: 20px;
	font-size: 18px;
	}
	
	
@media screen and (max-width: 800px) {
	p {
		font-size: 14px;
		padding: 5px;
		}
	body {
		width: 100%;
		}
	header {
		width: 100%;
		}
	header h1 {
		padding-top: 50px;
		}
	header h1 img {
		width: 70%;
		height: 70%;
		}
	div#header_conpany img {
		width: 80%;
		height: 80%;		
		}
	nav {
		display: none;
		}
	main {
		margin-top: 0px!important;
		}
	div#mainimage {
		width: 100%;
		height: 100%;
		}
	div#slide_wrap {
		display: none;
		}
	div#mainimage div#overimage {
		width: 100%;
		}
	div#mainimage div#overimage img {
		width: 80%;
		height: 80%;
		}
	div#about {
		padding-top: 30px
		}
	div#about section,
	div#fishing  section,
	div#kanroni section,
	div#enjoy  section {
		width: 100%;
		}
	div#repair {
		width: 100%;
	}
	div#repair img {
		width:100%;
		height: 100%;
		}

	div#about section img {
		width: 80%;
		height: 80%;
		}
	div#about section h3 img {
		width: 100%;
		height: 100%;
		}
	div#about p {
		width: 100%;
		}
	div#about_pic div {
		width: 50%;
		}
	div#about_pic div img {
		width: 100%;
		height: 100%;
		}
	div#fishing {
		margin-top: 30px;
		padding-top: 30px;		
		}
	div.fishing_pic,
	div.fishing_pic2 {
		float: none;
		text-align: center;
		}
	div.fishing_pic img,
	div.fishing_pic2 img {
		width: 80%;
		height: 80%;
		}
	div#kanroni {
		margin-top: 30px;
		padding-top: 30px;	
	}
	div#kanroni_image {
		width: 100%;
		}
	div#kanroni_image div {
		float: none;
		text-align: center;
		}
	div#kanroni_image p {
		width: 100%;
		}
	div#enjoy {
		margin-top: 30px;
		padding-top: 30px;		
		padding-bottom: 15px;
		}
	div#enjoy  section h2 img {
		width: 80%;
		height: 80%;
		}
	div#enjoy_cb {
		padding: 0px;
		padding-top: 30px;
		}
	div#enjoy img {
		width: 100%;
		height: 100%;
		}
	div#enjoy_image div.enjoy_box {
		float: none;
		width: 100%;
		margin: 0px;
		}
	div#enjoy div.enjoy_box img {
		width: 60%;
		height: 60%;
		}
		
	div#enjoy_image div.enjoy_box2 {
		float: none;
		width: 100%;
		margin: 0px;
		}
	div#enjoy div.enjoy_box2 img {
		width: 60%;
		height: 60%;
		}
	
	div#access {
		margin-top: 30px;
		}
	div#gmap {
		width: 100%;
		}
	div#gmap iframe {
		width: 100%;
		}
	footer {
		width: 100%;
		}
	div#footer_box {
		width: 100%;
		}
	div#footer_box div.left img {
		margin-left: 5px;
		}
	div#footer_box div.right img {
		margin-right: 5px;
		}
}




		/*▼▼▼モーダル▼▼▼*/

        .modalwin {
            position: fixed;
            width: 600px;
            background-color: #fff;
            border-radius: 5px;
            box-shadow: 0 2px 4px 0 #000;
            z-index: 1;
        }

        .modalwin dl {
            padding: 0px 10px;
        }

        .show {
            display: block;
        }

        .hide {
            display: none;
        }

        .modalwin h1 {
            background: #ededed;
            padding: 20px;
            border-radius: 5px 5px 0 0;
            font-size: 1.2em;
            margin-top: 0;
            text-align: center;
        }

        .modalwin-contents {
            padding: 5px;
        }

        .modalwin-contents img {
            margin: 0 0 1em 0;
            float: left;
            width: 30%;
            height: 30%;
        }

        .modalwin-contents p {
            margin: 0 0 1em 0;
            line-height: 1.8em;
        }

        #shade {
            position: fixed;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background-color: #999;
            opacity: 0.9;
            z-index: 1;
        }
		
		
		div#header_conpany {
			cursor: pointer;
			}
		
		div#modal {
			padding: 50px;
			}
		div#modal h2 {
			margin-bottom: 15px;
			}
		div#modal dl {
			margin-top: 20px;
			}
		div#modal dl dt {
			clear: both;
			float: left;
			margin-top: 12px;
			border-bottom: 1px solid #909090;
			padding-bottom: 10px;
			width: 30%;
			}
		div#modal dl dd {
			float: left;
			border-bottom: 1px solid #909090;
			margin-top: 12px;
			padding-bottom: 10px;
			width: 70%;
			}

        @media screen and (max-width: 480px) {
            .modalwin {
                width: 90%;
            }
			div#modal {
				padding: 15px;
			}
			
        }