@charset "UTF-8";
/*
@media screen and (max-width: 768px) {
*/
@media screen and (max-width: 860px) {

.pc {display:none;}
.mb {display:block;}
.pc_inline {display:none;}
.mb_inline {display:inline;}
.pc_inline_block {display:none;}
.mb_inline_block {display:inline-block;}

.pc_ip {display:none !important;}
.mb_ip {display:block !important;}
.pc_inline_ip {display:none !important;}
.mb_inline_ip {display:inline !important;}
.pc_inline_block_ip {display:none !important;}
.mb_inline_block_ip {display:inline-block !important;}

.mb_w60p { width:60%;}
.mb_w70p { width:70%;}
.mb_w80p { width:80%;}

/*----------------------------------------
 * フォント
 *----------------------------------------*/
body {
	line-height:2em;
	font-size:0.9rem;
}



/*----------------------------------------
 * ヘッダー
 *----------------------------------------*/
header, header.second {
	position:fixed;
	padding:0;
	width:100%;
	z-index:5;
	top:0;
}

header.second h1,
.toppage header h1 {
	position:relative;
	width:150px;
	margin:0 auto;
	padding-top:20px;
	z-index:2;
}

.toppage header h1 img {
	width:100%;
	height:auto;
	z-index:2;
}

header_top { display:none;}

/* SPメニューボタン */
.mb.mobile_button {
	position:absolute;
	width:60px;
	height:60px;
	top:20px;
	right:10px;
	background:url(/resources/images/common/mb_menu_button.png) no-repeat center center;
	background-size:cover;
	z-index:4;
}


/* ナビゲーション */
header.second nav,
.toppage nav.writing-rl {
	display:none;
	writing-mode:unset;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color:#b7a134;
	z-index:3;
}


/*
    position: absolute;
    display: block;
    height: 20e;
    right: 40px;
    top: 160px;
    font-size: 0.875rem;
*/

header.second nav ul,
.toppage nav.writing-rl ul {
	margin-top:20vh;
}

header.second nav ul,
header.second nav ul li,
.toppage nav.writing-rl ul,
.toppage nav.writing-rl ul li {
	display:block;
	margin-right:0;
	margin-left:0;
	padding:0;
	width:100%;
	font-size:1.5rem;
	letter-spacing:0.3em;
	margin-bottom:8vh;
	text-align:center;
}

header.second nav ul li a,
header.second nav ul li a:hover,
.toppage nav.writing-rl ul a,
.toppage nav.writing-rl ul a:hover{
	color:white;
}

header.second nav .mb_menu_logo,
.toppage nav.writing-rl .mb_menu_logo {
	position:absolute;
	width:110px;
	height:auto;
	left:calc(50% - 55px);
	top:calc(100vh - 80px);
}

/*----------------------------------------
 * ページテンプレート
 *----------------------------------------*/
article {
/*
	padding-top:52px;
*/
}

.recruit article {
/*
	padding-top:60px;
*/
}

/* 記事エリア */
section.article_area {
	padding-top:62px;
}

/* パンクズナビゲーション */
.pan_nav_area {
	display:none;
}

/* 見出し */
section.article_area article .std_h1 {
}

section.article_area article .std_h2 {
}


/*----------------------------------------
 * 基本書式
 *----------------------------------------*/
.std_width {
	width:100%;
}

/* 縦中横 */
.writing-rl em {
	left:0;
}

/* 2カラム（レイアウトパターン） */
.std_column2.lay_col2_1 {
}

.std_column2.lay_col2_1 .left {width:100%;}
.std_column2.lay_col2_1 .right {width:100%;}
.std_column2.lay_col2_1 .image {
	height:auto;
}


/* 3カラム（flex） */
.std_column3_flex {
	display:flex;
	flex-wrap:wrap;
}

.std_column3_flex .column {
	width:100%;
}




/* flex */

.std_flex2 {
	display:block;
}

.std_flex2 .column{
	width:100%;
}


.std_flex3 {
	display:block;
}

.std_flex3 .column{
	width:100%;
	margin-bottom:2em;
}

.std_flex3 .column .inner {
	width:70%;
	margin-left:auto;
	margin-right:auto;
}


/* 定義 */
dl.std_dl {
	display:block;
}

dl.std_dl dt{
	width:calc(100% - 1em);
	padding:0.5em 0;
	text-align:left;
	padding-left:1em;
}
dl.std_dl dd {
	width:calc(100% - 1em);
	border-bottom:none;
	padding:0.5em 0 1em 0.5em;
}



/* 表 */
/*
table.std_table,
table.std_table tbody,
table.std_table tr,
table.std_table th,
table.std_table td {
	display:block;
	text-align:left;
	background:none;
}

table.std_table th {
	border:none;
	padding:0.3em;
	padding-bottom:0;
}

table.std_table td {
	padding:0.3em;
}

table.std_table tr {
	margin-bottom:1em;
}
*/

/* 飾り罫付きの段落（縦書き） */
.para_v:before{
	content:'';
	background:url(/resources/images/history/para_h_momo_budou.png) no-repeat top left;
	position:absolute;
	display:block;
	width:30px;
	height:100%;
	top:40px;
	right:unset;
	left:15px;
}

.para_v {
	position:relative;
	padding-top:35px;
	padding-right:20px;
	letter-spacing:0em;
	font-size:1rem;
}

.para_v.pad_left_1 { padding-left:37px;padding-bottom:0;}
.para_v.pad_left_2 { padding-left:2em;}
.para_v.pad_left_3 { padding-left:37px;}
.para_v.pad_left_4 { padding-left:4em;}
.para_v.pad_left_5 { padding-left:5em;}


.std_column2 .left { width:100% !important;margin-bottom:25px;}
.std_column2 .right { width:100% !important;}

.writing-rl sup {
	top:-6px;
	left:unset;
}

/*----------------------------------------
 * 共通フッター 桃・ぶどう
 *----------------------------------------*/
.footer_flex_2 {
	display:block;
	width:100%;
	margin-bottom:100px;
}

.footer_flex_2 div.column {
	width:80%;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:60px;
}

.footer_flex_2 div.column div.image {
	width:100%;
}

.footer_flex_2 div.column h2 {
	right:0px;
	font-size:1.25rem;
	padding:0.5em 0.2em;
}

.footer_flex_2 div.column img.bg.momo { top:-35%;left:-35%;width:170%;}
.footer_flex_2 div.column img.bg.budou { top:-35%;left:-35%;width:170%;}




/*----------------------------------------
 * ページトップへ
 *----------------------------------------*/
/*
.totop {
	width:140px;
	height:30px;
	right:-57px;
}

.totop a {
	padding-top:8px;
}

.totop a:before {
	top:15px;
}

.totop a:after {
	top:11px;
}
*/


/*----------------------------------------
 * フッター
 *----------------------------------------*/

footer .tel_mail .tel,
footer .tel_mail .mail {
	display:block;
	margin-bottom:10px;
}

footer .tel_mail .tel {
	padding-right:3em;
}

/*----------------------------------------
 * 共通フォーマット
 *----------------------------------------*/
section.history {
	text-align:left;
	height:auto;
	margin-bottom:100px;
}

section.history h2 {
	margin-left:0px;
}

section.history div.para_v {
	height:auto;
}

section.history a {
	display:block;
	width:calc(90% - 2em);
	margin-left:auto;
	margin-right:auto;
	color:#3d340c;
	padding:0.5em 1em;
	margin-top:40px;
	margin-bottom:230px;
	box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.25);
	transition:background-color 0.5s, color 0.2s;
	z-index:2;
}

section.history a img {
	float:right;
	margin-top:8px;
}


/*----------------------------------------
 * トップページ
 *----------------------------------------*/
.toppage {
	padding-top:60px;
}

/* section.main */
.toppage .main h1 {
	position:relative;
	writing-mode: unset;
}

.toppage .main h1 span,
.toppage .main h1 strong,
.toppage .main h1 div {
	position:relative;
	width:100%;
	text-align:center;
	line-height:1em;
}

.toppage .main h1 span { 
	top:unset;
	font-size:1.25rem;
	margin-top:50px;
}

.toppage .main h1 strong { 
	top:unset;
	right:unset;
	font-weight:400;
	font-size:4.2rem;
	letter-spacing:-0.2em;
	margin-top:10px;
}

.toppage .main h1 div { 
	font-size:2.8rem;
	top:unset;
	left:unset;
	margin-top:10px;
	letter-spacing:-0.05em;
	margin-left:-0.1em;
}

.toppage .main h1 div em { 
	letter-spacing:-0.25em;
	margin-right:0.2em;
}

.toppage .main div.image {
	width:90%;
	height:auto;
	margin:35px auto 60px auto;
	aspect-ratio:124 / 152;
}

.toppage .main h2 {
	margin-top:0;
	margin-bottom:35px;
	font-size:1.4rem;
	letter-spacing:0.1em;
}

.toppage .main p {
	line-height:2em;
}

.toppage section.history .writing-rl {
	writing-mode: unset;
}

.toppage section.history h2.f32 {
	font-size:1.4rem;
	letter-spacing:0;
	text-align:center;
}

.toppage section.history .f12 {
	margin:20px 0 0 0;
	font-size:0.65rem;
}

.toppage section.history .pad_left_1:before {
	height:calc(100% - 35px);
}

.toppage .history .history_photo.p1{ width:112px;top:unset;bottom:143px;left:calc(50% - 70px);}
.toppage .history .history_photo.p2{ width:150px;top:unset;bottom:8px;left:calc(50% - 180px);}
.toppage .history .history_photo.p3{ width:112px;top:unset;bottom:175px;left:calc(50% - 220px);}
.toppage .history .history_photo.p4{ width:150px;top:unset;bottom:20px;right:calc(50% - 190px);}
.toppage .history .history_photo.p5{ width:112px;top:unset;bottom:194px;right:calc(50% - 200px);}

/*----------------------------------------
 * セカンドページ
 *----------------------------------------*/
.second {
}

.second article h1 {
	font-size:1.5rem;
}


/*----------------------------------------
 * 岡山の桃・ぶどうの歴史
 *----------------------------------------*/
.second.history section.history {
	padding-top:50px;
	margin-bottom:100px;
}

.second.history section.history .writing-rl {
    writing-mode: unset;
    display: block;
    text-align: left;
}

.second.history section.history h2 {
	margin-top:0;
	margin-bottom:0;
	font-size:1.4rem;
	letter-spacing:-0.05em;
	text-align:center;

}

.second.history section.history .writing-rl .f12 {
	margin:20px 0 0 0;
	font-size:0.65rem;
}

.second.history section.history .writing-rl .pad_left_1:before {
	height:calc(100% - 35px);
}

.second.history section.history_hr {
	padding-left:20px;
	padding-right:20px;
}

.second.history section.history_hr .para_h dl dt {
	float:none;
	width:80%;
	line-height:1em;
	font-size:0.6875rem;
}

.second.history section.history_hr .para_h dl dt span {
	display:inline;
	margin-right:0.5em;
	vertical-align:middle;
	position:relative;
	top:-2px;
}

.second.history section.history_hr .para_h dl dd {
	margin-left:20px;
}

.second.history section.history_hr h2 {
	position:relative;
	writing-mode:unset;
	font-size:1.7rem;
	padding:0;
	display:block;
	width:100%;
	left:unset;
	top:unset;
	margin-bottom:35px;
	margin-left:-10px;
}

.second.history h2.mb_history_hr_h2 {
	position:relative;
	writing-mode:unset;
	font-size:1.7rem;
	padding:0;
	display:block;
	padding-left:20px;
	padding-right:20px;
	left:unset;
	top:unset;
	margin-bottom:35px;
	margin-top:80px;
    font-weight: 400;
    line-height: 1.5em;
    color: #d3c785;
}



.second.history section.history_hr h2 img {
	vertical-align:middle;
	position:relative;
	top:-2px;
}

.second.history .history_hr_wrapper {
	margin-top:0;
	margin-left:20px;
	margin-right:20px;
	padding:20px 0 20px 20px;
}


.second.history section.history_hr.momo_budou h2 {
	height:auto;
	line-height:1.2em;
	left:0px;
	top:0px;
	display:none;
}

/*----------------------------------------
 * 岡山の桃、ぶどう 共通
 *----------------------------------------*/
.second.momo article,
.second.budou article {
	margin-bottom:100px;
}

.second.momo article .lead,
.second.budou article .lead {
	margin-top:50px;
}

.second.momo article .lead .image,
.second.budou article .lead .image {
    width: 80%;
	margin-left:auto;
	margin-right:auto;
}

.second.momo article .lead .right,
.second.budou article .lead .right{
	text-align:center;
	letter-spacing:0;
	font-size:1rem;
}

.second.momo article .lead .right span {
	letter-spacing:-0.5em;
}

.second.momo article .hinsyu,
.second.budou article .hinsyu {
	margin-top:100px;
}

.second.momo article .hinsyu h2,
.second.budou article .hinsyu h2,
.second.momo article .jiki h2,
.second.budou article .jiki h2,
.second.momo article .jyuni h2,
.second.budou article .jyuni h2,
.second.momo article .saibai h2,
.second.budou article .saibai h2,
.second.momo article .tabekata h2,
.second.budou article .tabekata h2 {
	margin:0 0 25px 0;
	text-align:center;
	font-size:1.5rem;
	line-height:2em;
}


.second.momo article .hinsyu .flex_3,
.second.budou article .hinsyu .flex_3 {
	margin:0 20px;
	display:flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.second.momo article .hinsyu .flex_3 div,
.second.budou article .hinsyu .flex_3 div {
	width:48%;
	margin:0 0 20px 0;
	text-align:center;
}

.second.momo article .hinsyu .flex_3 div:nth-child(5),
.second.budou article .hinsyu .flex_3 div:nth-child(5) {
	margin-left:auto;
	margin-right:auto;
}

.second.momo article .hinsyu .flex_3 div h3 span,
.second.budou article .hinsyu .flex_3 div h3 span {
	padding:0.5em;
	font-size:0.9rem;
	line-height:1.5em;
	letter-spacing:-0.1em;
}

/* 岡山県の桃の出荷時期 */
.second.momo article div.table_wrapper,
.second.budou article div.table_wrapper {
	position:relative;
	overflow-x:scroll;
}

.second.momo article div.table_wrapper .table_scroll,
.second.budou article div.table_wrapper .table_scroll {
	position:absolute;
	width:80px;
	height:auto;
	z-index:2;
	top:200px;
	left:calc(50% - 40px);
}

.second.momo article div.table_wrapper.table_momo_1 table{ width:860px;}
.second.momo article div.table_wrapper.table_momo_2 table{ width:860px;}
.second.momo article div.table_wrapper.table_momo_3 table{ width:860px;}

.second.budou article div.table_wrapper.table_budou_1 table{ width:860px;}
.second.budou article div.table_wrapper.table_budou_2 table{ width:860px;}
.second.budou article div.table_wrapper.table_budou_3 table{ width:860px;}
.second.budou article div.table_wrapper.table_budou_4 table{ width:860px;}

.second.momo article .jiki,
.second.budou article .jiki {
	margin-top:100px;
	padding-left:20px;
	padding-right:20px;
}

.second.momo article .jiki div.align_center,
.second.budou article .jiki div.align_center {
	text-align:left;
}

/* 全国もも産地順位及び品種構成 */
.second.momo article .jyuni,
.second.budou article .jyuni {
	margin-top:100px;
	padding-left:20px;
	padding-right:20px;
}

.second.momo article .jyuni h3,
.second.budou article .jyuni h3 {
	font-size:1.1rem;
	text-align:center;
}

.second.budou article .jyuni .f10.align_right {
	margin-top:0.5em;
	line-height:1.5em;
}

/* おかやまの桃づくり、ぶどうづくり */
.second.momo article .saibai,
.second.budou article .saibai {
	margin-top:100px;
	padding-left:20px;
	padding-right:20px;
}

.second.budou article .saibai .align_center.std_padding_bottom2 {
	text-align:left;
}

.second.momo article .saibai .arrow_wrapper .arrow {
	width:24px;
}

.second.momo article .saibai_box,
.second.budou article .saibai_box {
	margin-left:40px;
	width:unset;
	padding-left:50px;
	padding-top:25px;
	padding-right:25px;
	padding-bottom:25px;
}

.second.budou article .saibai_box {
	margin-left:0;
}

.second.momo article .saibai_box img {
	width:100%;
	height:auto;
	display:block;
	margin-bottom:10px;
}

.second.momo article .saibai .mb_align_left {
	text-align:left;
}

/* 食べ方 */
.second.momo article .tabekata,
.second.budou article .tabekata {
	margin-top:100px;
	padding-left:20px;
	padding-right:20px;
}

.second.momo article .tabekata .flex_2,
.second.budou article .tabekata .flex_2 {
	display:block;
}

.second.momo article .tabekata .flex_2 .column,
.second.budou article .tabekata .flex_2 .column {
	width:100%;
}

.second.momo article .tabekata .flex_2 .column .inner,
.second.momo article .tabekata .flex_2 .column .inner {
	padding:20px;
}

.second.momo article .tabekata .flex_2 .column .inner .gokan div {
	clear:both;
	line-height:1.5em;
	
}

.second.momo article .tabekata .flex_2 .column .inner .gokan span {
	display:block;
	margin-bottom:1em;
	float:left;
}

.second.momo article .tabekata .flex_2 .column .inner .w80p.div_center {
	width:100%;
}

.second.momo article .tabekata .mb_align_left {
	text-align:left;
}



.second.momo article .kirikata .flex_4 {
	display:flex;
	justify-content:space-between;
}

.second.momo article .kirikata .flex_4 {
	display:block;
}

.second.momo article .kirikata .flex_4 div.column {
	width:100%;
	margin-bottom:40px;
}

.second.momo article .kirikata .flex_4 div.column:after {
    background: url(/resources/images/momo/saibai_box_bottom.png) no-repeat center top;
    content: '';
    position: absolute;
    bottom: -25px;
    left: 0;
    width: 100%;
    display: block;
    width: 100%;
    height: 25px;
}

.second.momo article .kirikata .flex_4 div.column:nth-child(4):after {
	display:none;
}

.second.momo article .kirikata .number {
	position:absolute;
	width:80px;
    top:  calc(50% - 40px);
    left:-42px;
	z-index:2;
}

.second.momo article .kirikata .number:before {
	clip-path: polygon(50% 0, 100% 0, 100% 100%, 50% 100%);
}

.second.momo article .kirikata .inner {
	padding:30px 30px 30px 60px;
}

.second.momo article .kirikata a {
    margin: 50px auto 0 auto;
    font-size: 1.25rem;
    width: calc(100% - 1em);
    text-align: center;
    display: block;
    background-color: white;
    color: #3d340c;
    padding: 1em 0.5em;
    box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.25);
    transition: background-color 0.5s, color 0.2s, background-image 0.5s;
    line-height: 1em;
}

.second.momo article .tabekata .mb_align_left {
	text-align:left;
}

/*----------------------------------------
 * 岡山のぶどう
 *----------------------------------------*/

/* saibai_box2 */
.second.budou article .budou_saibai_2 {
	margin-top:0px;
	/*
	background-color:white;
	*/
}

.second.budou article .budou_saibai_2 h3 {
	margin-top:0px;
	padding-top:10px;
}

.second.budou article .saibai_box2 {
	position:relative;
	margin-bottom:40px;
}
.second.budou article .saibai_box2:after {
	content:'';
	position:absolute;
	display:block;
	width:100%;
	height:30px;
	bottom:-30px;
	background:url(/resources/images/budou/arrow_3.png) no-repeat center center;
	background-size:contain;
}


.second.budou article .saibai_box2 .sb2_inner {
	padding:13px;
	line-height:1.5em;
}

.second.budou article .saibai_box .saibai_box2.sb_1 .right {
	text-align:left;
	position:relative;
}

.second.budou article .saibai_box .saibai_box2.sb_1 img {
	width:48%;
	float:left;
}

.second.budou article .saibai_box .saibai_box2.sb_1 img:nth-child(2) { float:right;position:re}

.second.budou article .saibai_box .saibai_box2.sb_2 img,
.second.budou article .saibai_box .saibai_box2.sb_3 img,
.second.budou article .saibai_box .saibai_box2.sb_4 img,
.second.budou article .saibai_box .saibai_box2.sb_5 img,
.second.budou article .saibai_box .saibai_box2.sb_6 img {
	width:100%;
	height:auto;
}


.second.budou article .saibai_box2.sb_1,
.second.budou article .saibai_box2.sb_2,
.second.budou article .saibai_box2.sb_3,
.second.budou article .saibai_box2.sb_4,
.second.budou article .saibai_box2.sb_5,
.second.budou article .saibai_box2.sb_6 {
	position:relative;
	width:100%;
	margin:0 auto 50px auto;
	top:unset;left:unset;right:unset;bottom:unset;
}


.second.budou article .saibai_box img {
	display:block;
	width:100%;
	height:auto;
}

.second.budou article .budou_saibai_2 .arrow.ar1 { display:none;}
.second.budou article .budou_saibai_2 .arrow.ar1_2 { display:none;}
.second.budou article .budou_saibai_2 .arrow.ar2 { display:none;}
.second.budou article .budou_saibai_2 .arrow.ar3 { display:none;}
.second.budou article .budou_saibai_2 .arrow.ar4 { display:none;}
.second.budou article .budou_saibai_2 .arrow.ar5 { display:none;}
.second.budou article .budou_saibai_2 .arrow.ar6 { display:none;}

.second.budou article .saibai_box .budou_saibai_2 .arrow.ar_mb_1_2 { 
	width:18px;height:auto;
	float:none;
	left:calc(50% - 9px);
	top:calc(50% - 9px);
}

/* 選び方のポイント,美味しい食べ方 */
.second.budou article .erabikata_tabekata .erabikata_tabekata_inner {
	padding:20px;
} 

.second.budou article .erabikata_tabekata ul li {
	font-size:1rem;
	line-height:1.5em;
}

.second.budou article .erabikata_tabekata .kome {
	margin-bottom:20px;
}

.second.budou article .erabikata_tabekata .std_flex2 .std_column2 {
	width:100%;
}

.second.budou article .erabikata_tabekata .std_flex2 .std_column2 img {
	display:block;
	width:70%;
	margin-left:auto;
	margin-right:auto;
	margin-top:1em;
}


/* モーダルウィンドウ */
.std_modal_content {
	width:calc(100% - 120px);
	padding:40px;
}

.std_modal .std_text {
	text-align:center;
} 

.std_modal .std_text .jiki{ 
	position:relative;
	display:inline-block;
	margin-bottom:1em;
}

.std_modal h4 {
	margin:0 0 0.5em 0;
	text-align:center;
}

.std_modal .std_text .std_column2 {
	text-align:left;
}

/* プリロード関連 */
.toppage .preload {
	top:-60px;
}




}/* @media screen and (max-width: 860px)  */
