@charset "utf-8";

body{background:#fff;}
.txt_i{font-style:italic;}
.txt_repletion{font-size:0.8em;}

/* common */
#sbf_symbol { padding-bottom:30px; }
#sbf_main_cnt_board { padding:0 0 50px; }
#sbf_main_cnt_board .title { padding:30px 30px 0; }

.about_title { text-align:center; margin:40px 0 50px; }
.about_title a { display:block; text-decoration:none; -webkit-transition:.2s linear; -moz-transition:.2s linear; -o-transition:.2s linear; }
.about_title a:hover { opacity:0.7; }
.about_title h2 {
	width:580px; height:41px; margin:0 auto; text-indent:-9999px;
	background:url("../img/index/title_about.png") 0 0 no-repeat; }
.about_title h3 {
	width:506px; height:19px; margin:10px auto 0; text-indent:-9999px;
	background:url("../img/index/title_about2.png") 0 0 no-repeat;}
.sbf_about .about_title h3 { background:url("../img/index/title_about2.png") center top no-repeat;width:220px; height:55px; margin:0 auto;}
.about_title.vision h2{background-image:url("../img/vision/title_about.html");}
.about_title.vision h3{background-image:url("../img/vision/title_about2.html");}

.ind_con h1, .ind_con h2, .ind_con h3, .ind_con h4,
.ind_con p, .ind_con ul, .ind_con ol, .ind_con li,
.ind_con dl, .ind_con dt, .ind_con dd,
.ind_con table, .ind_con th, .ind_con td {
	font-family:"游ゴシック", YuGothic,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif; }
.ind_con p { margin-bottom:1em; }
.ind_con p:last-child { margin-bottom:0; }

.lead { padding:60px 30px 40px; text-align:center; }
.lead h3 { color:#0070a5; font-size:30px; font-weight:bold; }
.lead p { font-size:17px; line-height:1.7; }

.con { padding:0 30px; }
.con_box { padding:24px; }
.con_h3_big { padding-left:20px; color:#0070a5; font-size:22px; font-weight:bold; border-left:9px solid #0070a5; }
.con_h3 { margin-top:12px; padding:4px 20px; font-size:20px; font-weight:bold; background:#b8e3f0; color:#0070a5; }
.con_h4 { margin-bottom:20px; padding:0; font-size:20px; font-weight:bold; line-height:1.5; }

.link { background:url("../img/arrow2.png") 0 5px no-repeat; padding-left:25px; background-size:17px 17px; }
	.link.more_open,
	.link#more_open_water,
	.link#more_open_water_sp,
	.link#more_open_boss { background:url("../img/open.png") 0 5px no-repeat; background-size:17px 17px; }
	.link.more_close { background:url("../img/close.png") 0 5px no-repeat!important; background-size:17px 17px!important; }
.link a { font-weight:bold; color:#56bad5; }
.more {
	display:none; clear:both; margin-top:15px;
	border:1px solid #ccc; border-radius:20px; padding:30px; }
.more .close { background:url("../img/close.png") 0 48% no-repeat; padding-left:25px; background-size:17px 17px; }
.more h5 { font-weight:bold; }

.next_btn { text-align:center; margin-top:80px;max-width:90%;margin:80px auto 0; }
	.con_box + .next_btn { margin-top:56px; }
.next_btn a { color:#fff!important;
	box-sizing:border-box; display:inline-block; position:relative; min-width:300px; padding:15px 40px; text-decoration:none;
	font-size:20px; background:#0070a5; color:#fff; border-radius:2px; vertical-align:top;
	-webkit-transition:.2s linear; -moz-transition:.2s linear; -o-transition:.2s linear; }
.next_btn a:hover { background:#5BC2DC; }
.next_btn a:before {
	content:""; display:inline-block;
	width:9px; height:17px; margin-right:12px; background:url("../img/arrow.png") 0 0 no-repeat; background-size:9px 17px; }

.small { font-size:88%!important; color:#666!important; }
.txt_c { text-align:center; }
.txt_r { text-align:right!important; }
.smallsup{ font-size:50%!important; color:#666!important; }


/* index */
/*
body.individual_top #sbf_wrap_inr{padding-bottom:0!important;}
body.individual_top footer.sbfinc{margin-top:0;}
body.individual_top footer.sbfinc:before{background-image:url(../../images/wave.png)!important;top:-1px!important;}
body.individual_top footer.sbfinc:after{display:none!important;}
*/

#sbf_symbol{max-width:100%;padding:0;}
#sbf_main_cnt_top { background:none;max-width:100%;padding:0;width:100%;}
#sbf_main_cnt_top #container,#sbf_main_cnt_top .container { max-width:1156px; }
#sbf_main_cnt_top #content{padding:0;}

.bgcolor{background:#e7f3f9;padding:70px 0;}
.bgcolor02{background:#B8E3F0;padding:70px 0;}

.sbf_about {padding:30px 0px 0px;}
#sbf_main_cnt_top .page_title {
	max-width: 100%; height:auto;
	margin: 0 auto 1em; padding-left:0; padding-bottom: 6px;
	text-align: left; line-height: 100%; font-size: 1.313em; font-weight: bold;
    color: #5fc0d9; border-bottom: 1px solid #5fc0d9; }
#sbf_main_cnt_top .sbf_about .page_title  {margin-left:30px; margin-right:30px;}
.sbf_about .about_wrap ul { width:100%; }
.sbf_about .about_wrap li { float:none; margin:0; }
.sbf_about .about_wrap li img { width:100%; height:auto; }
.sbf_about .about_wrap ul { margin:auto; }
.sbf_about .about_wrap li { float:left; width:49%; margin-right:2%;margin-bottom:2%;line-height:0;}
.sbf_about .about_wrap li:nth-child(even) { margin-right:0; }

.pickup h2 {
	width:960px; height:24px; margin:auto; text-indent:-9999px;
	background:url("../img/title_pickup.png") 0 0 no-repeat;margin-bottom:40px; }
.pickup li { float:left; box-sizing:border-box; padding:10px; background:#ffffff; }
.pickup li a { text-decoration:none; }
.pickup li h3 {
	line-height:38px; margin-bottom:10px; padding-left:15px; font-size:20px; color:#222222;
	background:url("../img/index/arrow.png") top right no-repeat;
	background-size:40px 38px; }
.pickup li:hover h3 { opacity:0.8; -webkit-transition:.3s linear; -moz-transition:.3s linear; -o-transition:.3s linear; }
.pickup li .thumb { width:100%; height:auto; }
.pickup li p { padding:10px 15px 15px; font-size:16px; color:#494747; }

.pickup .regist { box-sizing:border-box; background:#fff; position:relative; }
.pickup .regist:after {
	content:""; display:block; width:106px; height:75px;
	background:url("../img/mail.png") 0 0 no-repeat; background-size:106px 75px;
	position:absolute; top:20px; right:20px; }
.pickup .regist p { color:#666; font-size:16px; }
.pickup .regist .btn_regist { margin-top:10px; }


/* vision */
#vision .vi_box1 { margin-top:40px;margin-bottom:15px; }
#vision .vi_box1 img { float:right; }
#vision .txt01 {
	float:left; width:405px; height:172px; margin-top:55px;margin-left:30px;
	text-indent:-9999px; background:url("../img/vision/vision_txt_01.html") 0 0 no-repeat; }
#vision .vi_box2 { }
#vision .txt02 {
	float:right; width:526px; height:139px; margin:30px 30px 0 0;
	text-indent:-9999px; background:url("../img/vision/vision_txt_02.html") 0 0 no-repeat; }
#vision .vi_box2 img { float:left;margin-left:30px; }

/* history */
#history .lead { padding-bottom:0; }

.history_nav { width:100%; height:64px; margin:40px 0; padding:10px 0; background:#0070a5; box-sizing:border-box; }
.history_nav.fixed { position:fixed; top:0; width:960px; margin:0; z-index:100; }
.history_nav nav { width:640px; margin:auto; position:relative; }
.history_nav_line { width:544px; height:1px; background:#fff; position:absolute; top:33px; left:23px; z-index:0; }
.history_nav ul { text-align:center; z-index:10; position:relative; }
.history_nav li { float:left; width:64px; height:44px; margin-right:45px; }
.history_nav li:last-child { margin:0; }
.history_nav li a { display:block; width:100%; height:100%; text-indent:-9999px; }
	.history_nav li:nth-child(1) a { background:url("../img/history/nav1.png") 0 0 no-repeat; }
	.history_nav li:nth-child(2) a { background:url("../img/history/nav2.png") 0 0 no-repeat; }
	.history_nav li:nth-child(3) a { background:url("../img/history/nav3.png") 0 0 no-repeat; }
	.history_nav li:nth-child(4) a { background:url("../img/history/nav4.png") 0 0 no-repeat; }
	.history_nav li:nth-child(5) a { background:url("../img/history/nav5.png") 0 0 no-repeat; }
	.history_nav li:nth-child(6) a { background:url("../img/history/nav6.png") 0 0 no-repeat; }
.history_nav li a:hover  { background-position: 0 -44px; }
.history_nav li a.active { background-position: 0 -88px; }

.history { padding:0 24px; }
.history.fixed { padding-top:144px; }
.history_title { padding-bottom:15px; border-bottom:3px solid #0070a5; }
.history_title h4 { width:50%; float:left; text-align:center; color:#0070a5; font-size:20px; font-weight:bold; }
.timeline { padding:50px 0; border-bottom:3px solid #0070a5; background:url("../img/history/tl_bg.png") top center repeat-y; }
.year_box { padding-top:40px; margin-top:-40px; }
.year_box .year {
	width:80px; height:80px; margin:0 auto -52px; line-height:76px; color:#0070a5; text-align:center;
	font-weight:bold; font-size:15px; white-space:nowrap; z-index:20; position:relative;
	background:#fff; border:3px solid #0070a5; border-radius:50%;
	font-family:"游ゴシック", YuGothic,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",
				"メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif; }
.year_box .year span { font-size:19px; margin-left:2px; }
.news_box { margin-bottom:15px; font-weight:bold; z-index:10; position:relative; }
	.news_box:last-child { margin-bottom:0; }
.news_box dt { color:#0070a5; background:#fff; }
.news_box dd img { margin-top:10px; }

/* overview */
#business-world_map { width: 100%; max-width: 900px; height: 80%; margin: 10px auto 0; position: relative; }
#business-world_map .bg { text-align: center; }
#business-world_map .bg img { width: 100%; max-width: 100%; height: auto; vertical-align: top; }
#business-world_map .viewport { position: relative; top: 0; left: 0; width: 100%; height: 100%; }
#business-world_map .balloon a { display: block; width: 100%; cursor:default; }
#business-world_map .balloon a img { max-width: 100%; height: auto; vertical-align: bottom; }
#business-world_map .oceania a { position: absolute; left: 38.5%; top: 48.8%; width: 18.8%; height: auto; }
#business-world_map .europe a { position:absolute; left: 11.56%; top: 1.5%; width: 18.8%; height: auto; }
#business-world_map .asia a { position: absolute; left: 21.5%; top: 30.8%; width: 18.8%; height: auto; }
#business-world_map .america a { position: absolute; left: 68.24%; top: 26.8%; width: 18.8%; height: auto; }
#business-world_map .notes { position: absolute; bottom: 4%; right: 10%; text-align: left; font-size: 0.750em; line-height: 1.2; }
#business-world_map .notes:before { content: '※'; position: absolute; left: -1.2em; display: block; width: 1em; height: 1em; font-size: 12px; }
#business-world_map .notes span { text-align: left; display: inline-block; vertical-align: top; }
#business-world_map .japan a { position: absolute; left: 43.60%; top: 15.40%; width: 18.8%; height: auto; }
.about_block2{ width:568px; margin:40px  auto 0 auto; text-align:center; }
.about_block2 p.notes { font-size: 78%; line-height: 1.9; text-align:left; margin-top:10px; }

/* domestic */
#domestic .con_h3_big { z-index:20; position:relative; }
#domestic .dom_graph { z-index:10; position:relative; text-align:center; margin:-50px 0 40px; }
#domestic .dom_product { text-align:center; margin-bottom:50px; }

/*factory*/
#factory .tour ul {padding:10px 0 30px;}
#factory .tour li{  text-align:center; font-size:0.9em;}
#factory .tour li a { text-decoration:none;}
#factory .tour li img {max-width:100%; margin-top:10px;}
#factory .btn { background-color:#56bad5; color:#FFFFFF; padding:10px 15px; text-decoration:none;}
#factory a { transition:.3s;}
#factory a:hover {opacity:0.7;}

.page_navi a {color:#0070a5!important;}

@media (min-width: 1000px){
/* index */
.pickup li { width:32%; margin-right:2%;margin-bottom:2%;}
.pickup li:nth-child(3n) { margin-right:0; }
}

@media (min-width: 768px){
.no-pc { display:none; }
.no-sp { display:block; }

.page_navi { background:#f2f9fa; text-align:center;  }
.page_navi li {
	display:inline-block; vertical-align:top;
	font-size:17px;
	font-family:"游ゴシック", YuGothic,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
	background:url("../img/nav_line.png") 0 50% no-repeat; }
	.page_navi li:nth-child(1) { background:none; }
	.page_navi li:nth-child(1), .page_navi li:nth-child(2), .page_navi li:nth-child(3) { width:110px; }
	.page_navi li:nth-child(4), .page_navi li:nth-child(5), .page_navi li:nth-child(6) { width:140px; }
.page_navi a { display:block; padding:22px 0 22px 2px; text-decoration:none; color:#0070a5!important; position:relative; }
.page_navi .active a { font-weight:bold; }
.page_navi a:after {
	content:"";	display:block; position:absolute; z-index:10;
	width:0px; height:3px; bottom:0; left:0; background:#0070a5;
	transition: all .3s ease; -webkit-transition: all .3s ease; }
.page_navi a:hover:after, .page_navi .active a:after { width:100%; }

.con_box + .con_box { padding-top:0; }
.con_box .left  { float:left; width:450px; }
.con_box .right { float:right; width:370px; }
.con_box .half_left  { float:left; width:420px; }
.con_box .half_right { float:right; width:420px; }

/*index*/
.sbf_about .about_wrap {background-color:#e7f3f9;}
.sbf_about .about_title { padding:0 0 30px; margin:0;}
.sbf_about .about_title h2 { background:url("../img/index/title_about.png") center no-repeat; width:596px; height:35px;}
.sbf_about .about_title h3 { margin-bottom:10px; }
.pickup .regist { width:720px; margin:30px auto; padding:25px 215px 25px 25px; }

/* vision */
#vision .lead { padding-bottom:0; }

/* strength */
#strength .con_h3_big { margin-left:54px; }

/* history */
.year_box .left  { width:417px; float:left; }
.year_box .right { width:417px; float:right; }
.year_box .left  .news_box dl { padding-right:65px; }
.year_box .right .news_box dl { padding-left:65px; }
.year_box .right .news_box dt { width:90px; padding-left:10px; }
.year_box .right .news_box dd { margin-left:90px; background:#fff; }
.news_box.line { background:url("../img/history/line.png") 0 0 repeat-x; }
.news_box dt { width:110px; float:left; }
.news_box dd { margin-left:110px; }
.news_box dd span { background:#fff; padding-right:5px; display:inline-block; }
.news_box.product dd.txt { width:162px; margin:0; float:left; }
.news_box.product dd.bottle { width:100px; margin:0; float:right; text-align:center; }
.news_box.product dd.bottle img { margin:0; }

#news1972 { margin-top:50px; }
#news1974 { margin-top:70px; }
#news1981 { margin-top:50px; } #news1981 .bottle { margin-top:-10px; }
#news1991 { margin-top:30px; } #news1991 .bottle { margin-top:-40px; }
#news1992 { margin-top:0px; } #news1992 .bottle { margin-top:-10px; }
#news1999 { margin-top:150px;margin-bottom:-70px; }
#news2004 { margin-top:60px; } #news2004 .bottle { margin-top:-55px; }
#news2006 { margin-top:30px; } #news2006 .bottle { margin-top:-20px; }
#news2009 { margin-top:200px;margin-bottom:-70px; }
#news2011 { margin-top:70px; }
#news2012 { margin-top:150px; } #news2012 .bottle { margin-top:-40px; }
#news2013 { margin-top:30px; }
#news2013_2 { margin-top:32px; } #news2013_2 .bottle { margin-top:-20px; }
#news2015 { margin-top:30px; }
#news2015_2 { margin-top:372px; } #news2015_2 .bottle { margin-top:-10px; }
#news2017_2 { margin-top:178px; }

/* overview */
#business-world_map .notes { position: absolute; bottom: 4%; right: 10%; text-align: left; font-size: 0.750em; line-height: 1.2; }
p.notes { text-indent: -1.5em; }

/* overseas */
#overseas .ov_flow { width:100%; height:640px; position:relative; background:url("../img/overseas/ov_img_01.html") 0 0 no-repeat; }
#overseas .ov_flow .txt { width:460px; height:auto; position:absolute; top:0; left:0; font-size:17px; }
#overseas .ov_flow .txt p { line-height:1.7; }
#overseas .ov_left  { float:left; width:440px; }
#overseas .ov_right { float:right; width:440px; }

/*factory*/
#factory .tour li{ float:left; width:31%; margin:0 1%;}

}

@media (min-width: 768px) and (max-width: 999px){

/* index */
.sbf_about .title h2 { width:100%; background-size:100% auto; }
.pickup h2 { width:100%; background-size:100% auto; }
.pickup li { width:49%; margin:13px 2% 0 0; }
.pickup li:nth-child(2n) { margin-right:0; }

}

@media (max-width: 767px){
.no-pc { display:block; }
.no-pc img { max-width:100%; height:auto; }
.no-sp { display:none; }

.bgcolor{padding:40px 0;}
.bgcolor02{padding:40px 0;}

/* common */
#sbf_main_cnt_board { padding-bottom:15px; }
#sbf_main_cnt_board .title { padding:15px; }
.about_title { margin:20px 0; }
.about_title h2 { max-width:100%; margin-bottom:10px; background-size:contain; background-position:center center; }
.about_title h3 { margin:0;  background-size:contain; background-position:center center;}
.page_navi { padding:0 15px; }
.page_navi li {
	width:49%; box-sizing:border-box;
	margin-bottom:10px; background:#f2f9fa; border:2px solid #0070a5; font-size:15px;
	font-family:"游ゴシック", YuGothic,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif; }
	.page_navi li:nth-child(2n+1) { float:left; }
	.page_navi li:nth-child(2n)   { float:right; }
.page_navi a { display:block; padding:10px 15px; text-decoration:none; color:#0070a5; position:relative; }
.page_navi a:hover, .page_navi .active a { font-weight:bold; }
.page_navi a:before {
	content:""; display:inline-block; width:6px; height:11px; margin-right:12px;
	background:url("../img/arrow3.png") 0 0 no-repeat; background-size:6px 11px; }

.lead { padding:30px 15px; }
.lead h3 { font-size:22px; line-height:1.5; }
.lead p { font-size:16px; line-height:1.5; }
.con { padding:15px; }
.con_box { padding:15px 0; }
.con_box .half_right { margin-top:15px; }
.con_box .half_left img,
.con_box .half_right img { max-width:100%; height:auto; }
.con_h3_big { padding-left:12px; font-size:18px; line-height:1.4; border-width:7px; }
.con_h3 { padding:6px 15px; font-size:18px; }
.con_h4 { font-size:16px; margin-bottom:12px; }
.more { padding:15px; }
.more h5 { margin-bottom:5px; }
.next_btn { margin-top:30px; }
.next_btn a { width:100%; padding:12px 40px; font-size:16px;}
.next_btn a::before { vertical-align:-2px; }

/* index */
.pickup h2 { width:100%; height:auto; margin:0 0 5px; text-indent:0; background:none; font-size:18px; font-weight:bold; }
.sbf_about { margin:0 0 30px; padding:0; background:none; box-shadow:none; }
.sbf_about .about_wrap{padding:0 10px;}
.sbf_about .about_wrap li{width:100%;float:none;}
.pickup li { width:49%; margin:8px 2% 0 0; }
.pickup li:nth-child(2n) { margin-right:0; }
.pickup li h3 { padding:0; font-size:15px; line-height:19px; background-size:20px 19px; }
.pickup li p { padding:0; font-size:13px; }

.pickup .regist { width:100%; padding:15px 100px 15px 15px; }
.pickup .regist:after {
	width:75px; height:53px; background-size:75px 53px;
	position:absolute; top:15px; right:15px; }
.pickup .regist p { font-size:13px; }

/* vision */
#vision .no-pc .con { text-align:center; }
#vision .no-pc .con img { max-width:100%; height:auto; }
#vision .no-pc .txt .main { font-size:20px; color:#0070a5; display:inline-block; margin:10px 0 5px; line-height:1.4; font-weight:bold; }
#vision .no-pc .txt .en { font-size:11px; color:#858585; display:inline-block; line-height:1.2; }

/* strength */
#strength .con_h3_big { margin:0 15px; }
#strength .main_img img { width:100%; height:auto; }
#strength .con_box .right { display:none; }

/* history */
.history_nav { display:none; }
.history { padding:0!important; }
/*.history_nav { margin-bottom:10px; }
.history_nav.fixed { width:100%; }*/
.history_title { display:none; }
.timeline { background-size:200px auto; padding:15px 0; text-align:center; border-top:3px solid #0070a5; }
.year_box { padding-bottom:25px; }
.year_box .year { margin-bottom:15px; }
.news_box { background:#fff; margin-bottom:20px; }
.news_box.product dd.txt { width:auto; }
.news_box.product dd.txt br { display:none; }

/* overview */
#overview .lead { padding-bottom:0; }
#business-world_map { overflow: hidden; }
#business-world_map .viewport { overflow:hidden; width: 119.34%; max-width: 119.34%; margin-left: -9.67%; }
#business-world_map .notes {
	display: inline-block; position: relative; top: 0; left: 0; padding: .5em 0 2em; width: auto; font-size: 75.0%; float: right; }
#overview .no-pc .con_h3_big { margin-bottom:10px; }

/* domestic */
#domestic .brand { margin-bottom:25px; }

/* overseas */
#overseas .lead { padding-bottom:0; }
#overseas .txt_c img { max-width:100%; height:auto; }

/*factory*/
#factory .tour li{ margin-bottom:20px;}

}

@media (min-width: 600px) and (max-width: 767px){.pickup .regist { margin:15px 0; }}
@media (max-width: 599px){.pickup .regist { margin:0; }}

@media screen and (max-width: 480px){
/* overview */
#business-world_map .notes { width: 90%; float: none; margin-left: 10%; }
#business-world_map .notes br { display: none; }

}

@media print {
.about_title h2 { width:100%; background-size:100% auto; }
.sbf_about { padding:30px; }
.sbf_about .about_wrap li { width:49%; margin:5px 2% 0 0; float:left; }
.sbf_about .about_wrap li:nth-child(2n) { margin-right:0; }
.pickup li { width:31%; height:auto; margin:20px 2% 0 0!important; }
.pickup li:nth-child(2n) { margin-right:2%; }
.pickup li:nth-child(3n) { margin-right:0; }

}